質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

Q&A

1回答

1580閲覧

Nuxt.jsのNuxt Fatal Error

gitaro-p

総合スコア12

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Nuxt.js

Nuxt.jsは、ユニバーサルなSPAが開発可能なVue.jsベースのフレームワーク。UIの描画サポートに特化しており、SSRにおけるサーバーサイドとクライアントサイドのUIレンダリングなどさまざまな機能を持ちます。

0グッド

0クリップ

投稿2020/04/23 15:47

編集2020/05/02 15:37

Nuxt.jsでプロジェクトを作り、npm install @nuxtjs/markdownit --saveとnpm install nuxt-fontawesome --saveで
markdownitnuxt-fontawesomeをインストールし、アイコンを使えるように以下でアイコンをインストールしました。
$ npm install @fortawesome/free-solid-svg-icons --save
$ npm install @fortawesome/free-brands-svg-icons --save

その後、Nuxt.config.jsファイルを編集し、npm run devで以下のエラーになりました。
何か考えられることを含め、他に追記することが必要な場合も教えて下さい。

npm

1

FATAL Invalid or unexpected token 00:33:31

SyntaxError: Invalid or unexpected token
at Object.compileFunction (vm.js:381:18)
at Generator.next (<anonymous>)

╭──────────────────────────────────────────────╮
│ │
│ ✖ Nuxt Fatal Error │
│ │
│ SyntaxError: Invalid or unexpected token │
│ │
╰──────────────────────────────────────────────╯

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! jam_portfolio@1.0.0 dev: nuxt
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the jam_portfolio@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:

SyntaxError: Invalid or unexpected token
at Object.compileFunction (vm.js:381:18)
at Generator.next (<anonymous>)

以下がnuxt.config.jsです。

// src/nuxt.config.js

export default {
mode: 'universal',
/*
** Headers of the page
/
head: {
title: process.env.npm_package_name || '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
]
},
/

** Customize the progress-bar color
/
loading: { color: '#fff' },
/

** Global CSS
/
css: [

'@fortawesome/fontawesome-svg-core/styles.css'

],
/

** Plugins to load before mounting the App
/
plugins: [

{ src: '~plugins/font-awesome', ssr: false }

],
/

** Nuxt.js dev-modules
/
devModules: [
// Doc: https://github.com/nuxt-community/nuxt-tailwindcss
'@nuxtjs/tailwindcss',
],
/

** Nuxt.js modules
*/
modules: [
'@nuxtjs/pwa',
'@nuxtjs/markdownit',
'nuxt-fontawesome'


],

markdownit: {
html: true,
injected: true,
linkify: true,
breaks: false
},

fontawesome: {
component: 'fa'
},

/*
** Build configuration
/
build: {
/

** You can extend webpack config here
*/
extend (config, ctx) {
}
}
}

。 ### 試したこと **$brew doctor**

$ brew doctor
Please note that these warnings are just used to help the Homebrew maintainers
with debugging if you file an issue. If everything you use Homebrew for is
working fine: please don't worry or file an issue; just ignore this. Thanks!

Warning: A newer Command Line Tools release is available.
Update them from Software Update in System Preferences or run:
softwareupdate --all --install --force

If that doesn't show you an update run:
sudo rm -rf /Library/Developer/CommandLineTools
sudo xcode-select --install

Alternatively, manually download them from:
https://developer.apple.com/download/more/.

Warning: You have unlinked kegs in your Cellar.
Leaving kegs unlinked can lead to build-trouble and cause brews that depend on
those kegs to fail to run properly once built. Run brew link on these:
gettext

Warning: Your Xcode (11.2) is outdated.
Please update to Xcode 11.4.1 (or delete it).
Xcode can be updated from the App Store.

Warning: Your XQuartz (2.7.8) is outdated.
Please install XQuartz 2.7.11 (or delete the current version).
XQuartz can be updated using Homebrew Cask by running:
brew cask reinstall xquartz

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

nuxt.config.js上の

plugins: [

{ src: '~plugins/font-awesome', ssr: false }

],

とありますが、

もしかしたら、{ src: '~/plugins/font-awesome', ssr: false }

このようにすると、うまくいくかもしれません。

もし、これ以外に原因があるとすれば、componentsやpagesなどにあるvueファイル等だと考えられます。

投稿2020/05/09 20:29

ff7575

総合スコア123

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

gitaro-p

2020/05/10 05:38

回答ありがとうございます! 言われたコードにしてみたのですが、エラーが解消されませんでした????
ff7575

2020/05/10 17:46

的外れな回答で申し訳ありませんでした。 fontawesomeを利用するコードが載ったvueファイルはありますでしょうか? もし、よろしければそちらの方を見せていただきたく存じます。 fontawesomeの利用前でエラーが起こらなかったのであれば、利用するためのコードのどこか(fontawesome.jsを含めて)にスペルミスが混在している可能性がありますんで。
gitaro-p

2020/05/12 14:21

とんでもございません! 以下になります。 // src/plugins/font-awesome.js import Vue from 'vue' import { library } from '@fortawesome/fontawesome-svg-core' import { faPlus } from '@fortawesome/free-solid-svg-icons' import { faTwitter, faGithub } from '@fortawesome/free-brands-svg-icons' import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' library.add(faPlus) library.add(faTwitter, faGithub) Vue.component('fa-icon', FontAwesomeIcon) Vue.config.productionTip = false
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問