Nuxt.jsでのSCSS使用手順

0,目次

  1. はじめに
  2. Nuxt.jsでのSCSS使用手順
    1. モジュールの導入
    2. SCSSファイルの配置
    3. nuxt.config.jsの編集
    4. Vueファイルにimportの記載
  3. 感想
  4. 参考文献

1,はじめに

Nuxt.jsではCSSだけでなく、SCSSも使えるという話を聞きました。

そこで、SCSSをNuxt.jsで使用できないか試したところ、

自動コンパイル的な感じで、SCSSファイルの直接読み込みができていました。

最近の技術の凄さに驚きです(日進月歩の世界だなと思いました)。

そこで、Nuxt.jsでSCSSを使用する手順を記載します。

続きを読む »

Nuxt.jsの「Error: No build files found in XXX」への対応

0,目次

  1. はじめに
  2. あ、凡ミスだこれ
  3. 原因・対応
  4. 参考文献

1,はじめに

Nuxt.jsで開発をしていると、

npm start devコマンドの実行に失敗することがあります。

今回、以下のエラーが表示されました。

✖ Nuxt Fatal Error
Error: No build files found in
/Users/jskny/Documents/Workspace/Project/byakko/dev/.nuxt/dist/server.
Use either `nuxt build` or `builder.build()` or start nuxt in development mode.

では、エラー潰しを始めましょう。

続きを読む »

Nuxt.jsで「Adjacent JSX elements must be wrapped in an enclosing tag.」が出る場合の対処法

0,目次

  1. はじめに
  2. 原因
  3. 対処
  4. 参考文献

1,はじめに

Nuxt.jsでアプリを皆さんは作りますでしょうか?

今回「npm run dev」を実行した際に、

以下のようなエラーが表示されました。

Module Error (from ./node_modules/eslint-loader/index.js): friendly-errors 21:59:31

/Users/jskny/Documents/Workspace/Project/byakko/components/AppLogo.vue
  10:1  error  Parsing error: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment ...?

このエラーに対して、以下の記事を参考に、対処を行いました。

NuxtのESLintのエラー対応 - Qiita

このエラーの原因と対処法について、情報共有させていただきます。

続きを読む »

Nuxt.jsの「No ESLint configuration found.」への対処法

0,目次

  1. はじめに
  2. 原因
  3. 対処
  4. 対処2
  5. 参考文献

1,はじめに

Nuxt.jsを導入すべく、Vue-cliをMac OSに導入しました。

そして、下記の記事を参考にNuxt.jsのサンプルアプリの起動を試みました。

Nuxt.js使ってみた - Qiita

しかし、開発サーバーの起動を行うと、

以下のようなエラーが表示されました。

jskny@MacBook-Air byakko % npm run dev

> byakko@1.0.0 dev /Users/jskny/Documents/Workspace/Project/byakko
> nuxt


   ╭─────────────────────────────────────────────╮
   │                                             │
   │   Nuxt.js v2.10.2                           │
   │   Running in development mode (universal)   │
   │                                             │
   │   Listening on: http://localhost:3000/      │
   │                                             │
   ╰─────────────────────────────────────────────╯

ℹ Preparing project for development                                   17:34:59
ℹ Initial build may take a while                                      17:34:59
✔ Builder initialized                                                 17:35:00
✔ Nuxt files generated                                                17:35:00

✖ Client
  Compiled with some errors in 2.70s

✔ Server
  Compiled successfully in 2.20s


ERROR  Failed to compile with 1 errors               friendly-errors 17:35:03

Module build failed (from ./node_modules/eslint-loader/index.js):
Error: No ESLint configuration found.

本稿では、このエラーへの対処を行います。

続きを読む »