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

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

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

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

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

Nuxt.js

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

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Docker

Dockerは、Docker社が開発したオープンソースのコンテナー管理ソフトウェアの1つです

Q&A

解決済

1回答

4435閲覧

【Nuxt.js】npm run buildでError: Cannot find moduleとなってしまう【Docker】

退会済みユーザー

退会済みユーザー

総合スコア0

npm

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

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

Nuxt.js

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

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Docker

Dockerは、Docker社が開発したオープンソースのコンテナー管理ソフトウェアの1つです

0グッド

0クリップ

投稿2022/04/07 07:50

編集2022/04/08 23:28

前提

独学でSPAポートフォリオを作成しております。
フロントエンドはNuxt.js、バックエンドにRailsを採用しています。
パッケージnuxt-webfontloaderをインストールしnuxt.config.jsのmodulesへ追記したところdocker-compose buildにてエラー発生。

実現したいこと

どうしたらBuildが成功するのか知りたいです。
あとnode_modulesがしっかり更新されているのかが不安です。

発生している問題・エラーメッセージ

=> ERROR [7/7] RUN npm run build 1.7s ------ > [7/7] RUN npm run build: #11 0.581 #11 0.581 > app@1.0.0 build /app #11 0.581 > nuxt build #11 0.581 #11 1.241 #11 1.241 WARN mode option is deprecated. Please use ssr: true for universal mode or ssr: false for spa mode and remove mode from nuxt.config #11 1.241 #11 1.570 #11 1.570 WARN Module nuxt-webfontloader not found. #11 1.570 #11 1.572 #11 1.572 FATAL Cannot find module 'nuxt-webfontloader' #11 1.572 Require stack: #11 1.572 - /app/node_modules/@nuxt/core/dist/core.js #11 1.572 #11 1.572 Require stack: #11 1.572 - node_modules/@nuxt/core/dist/core.js #11 1.572 at Function.Module._resolveFilename (internal/modules/cjs/loader.js:1029:15) #11 1.572 at Function.resolve (internal/modules/cjs/helpers.js:79:19) #11 1.572 at p (node_modules/jiti/dist/jiti.js:1:52925) #11 1.572 at Resolver.g [as _require] (node_modules/jiti/dist/jiti.js:1:54200) #11 1.572 at Resolver.requireModule (node_modules/@nuxt/core/dist/core.js:381:29) #11 1.572 at ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:182:38) #11 1.572 at node_modules/@nuxt/utils/dist/utils.js:639:43 #11 1.572 at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:55:5) #11 1.572 at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:478:5) #11 1.572 #11 1.579 #11 1.579 ╭────────────────────────────────────────────────────╮ #11 1.579 │ │ #11 1.579 │ ✖ Nuxt Fatal Error │ #11 1.579 │ │ #11 1.579 │ Error: Cannot find module 'nuxt-webfontloader' │ #11 1.579 │ Require stack: │ #11 1.579 │ - /app/node_modules/@nuxt/core/dist/core.js │ #11 1.579 │ │ #11 1.579 ╰────────────────────────────────────────────────────╯ #11 1.579 #11 1.600 npm ERR! code ELIFECYCLE #11 1.600 npm ERR! errno 1 #11 1.601 npm ERR! app@1.0.0 build: `nuxt build` #11 1.601 npm ERR! Exit status 1 #11 1.601 npm ERR! #11 1.601 npm ERR! Failed at the app@1.0.0 build script. #11 1.601 npm ERR! This is probably not a problem with npm. There is likely additional logging output above. #11 1.607 #11 1.607 npm ERR! A complete log of this run can be found in: #11 1.607 npm ERR! /root/.npm/_logs/2022-04-07T07_23_21_567Z-debug.log ------ executor failed running [/bin/sh -c npm run build]: exit code: 1 ERROR: Service 'frontend' failed to build : Build failed

該当のソースコード

package.json

1 "dependencies": { 2 "@nuxtjs/axios": "^5.3.6", 3 "nuxt": "^2.0.0", 4 "nuxt-webfontloader": "^1.1.0"

nuxt.config.js

1 modules: [ 2 // Doc: https://axios.nuxtjs.org/usage 3 '@nuxtjs/axios', 4 'nuxt-webfontloader', 5 ],

試したこと

npm install はしましたがnode_modulesが更新されているのかは不明です。パスが間違っている可能性もあります。
node_modules, package.json, package-look.jsonはfrontendディレクトリ直下にあります。
docker-compose run --rm frontend npm rootで確認したところ
/app/node_modulesとなっています。

補足情報(FW/ツールのバージョンなど)

npm version
{
app: '1.0.0',
npm: '6.14.4',
ares: '1.16.0',
brotli: '1.0.7',
cldr: '37.0',
icu: '67.1',
llhttp: '2.0.4',
modules: '83',
napi: '6',
nghttp2: '1.40.0',
node: '14.3.0',
openssl: '1.1.1g',
tz: '2019c',
unicode: '13.0',
uv: '1.37.0',
v8: '8.1.307.31-node.33',
zlib: '1.2.11'
}

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

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

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

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

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

guest

回答1

0

ベストアンサー

FrontendディレクトリのDockerfileへRUN npm install を追記した所、正常にdocker-compose buildが成功しました。

投稿2022/04/08 14:28

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問