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

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

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

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

npm

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

Node.js

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

Q&A

1回答

3290閲覧

npm run serve 中にファイルを変更しても変更が反映されなくなってしまいました。

sususu

総合スコア99

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

npm

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

Node.js

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

0グッド

0クリップ

投稿2021/07/25 12:55

npm run serve 中にファイルを変更しても、変更が反映されなくなってしまいました。
今までパソコンAを使用して開発を行ってきました。パソコンを買い替えたのでパソコンBに環境を映して開発を始めようとしました。
パソコンAでは npm run serve をし起動している間ファイルを変更すると即座にブラウザに変更がされるのは確認しております。
パソコンBにて node_modules package.json package-lock.json vue.config.js もそのまま移して来たので npm ci コマンドで実行し同じ環境を作成したつもりでした。
ブラウザでもアプリは問題なく起動しているのですが、npm run serve した時にファイルを変更してもブラウザ上変更が反映されません。(開発用8080ポートは使用しておりますが。)
ファイルを変更してもターミナルに動きがないので「監視」されていないように思えます。
どのようにしたら、ファイルの変更が即座にブラウザに変更されますでしょうか。
どなたかご教授頂かれば幸いです。よろしくお願いいたします。

環境

docker ubuntu webpack vue-cli npm

バージョン

node -v v10.24.0 npm -v 5.8.0

npm run serve 時のターミナル

npm run serve npm WARN npm npm does not support Node.js v10.24.0 npm WARN npm You should probably upgrade to a newer version of node as we npm WARN npm can't make any promises that npm will work with this version. npm WARN npm Supported releases of Node.js are the latest release of 4, 6, 7, 8, 9. npm WARN npm You can find the latest version at https://nodejs.org/ > frontend@0.1.0 serve /django_project/frontend > vue-cli-service serve INFO Starting development server... 10% building 0/1 modules 1 active ...ack/hot/de10% building 1/2 modules 1 active ...erver/clie98% after emitting CopyPlugin DONE Compiled successfully in 24154ms 12:34:47 PM App running at: - Local: http://localhost:8080/ It seems you are running Vue CLI inside a container. Access the dev server via http://localhost:<your container's external mapped port>/ Note that the development build is not optimized. To create a production build, run npm run build.

package.json

{ "name": "frontend", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, "dependencies": { "axios": "^0.21.1", "core-js": "^3.11.0", "vue": "^2.6.12", "vue-axios": "^3.2.4", "vue-cookies": "^1.7.4", "vue-router": "^3.5.2", "vuetify": "^2.5.6", "vuex": "^3.6.2" }, "devDependencies": { "@vue/cli-plugin-babel": "^4.5.12", "@vue/cli-plugin-eslint": "^4.5.12", "@vue/cli-plugin-router": "^4.5.12", "@vue/cli-plugin-vuex": "^4.5.12", "@vue/cli-service": "^4.5.12", "babel-eslint": "^10.1.0", "eslint": "^6.8.0", "eslint-plugin-vue": "^6.2.2", "vue-template-compiler": "^2.6.12" } }

試したこと
1.下記のコマンドでnpmをリセット

# キャッシュを削除する。 npm cache clean --force # npm 配下もクリーンにする。 rm -rf ~/.npm # node_modules を削除する。 rm -rf node_modules

結果は変わりませんでした。

2.nodeのバージョンを最新16.5.0バージョンにアップデート
npm run serve 時の WARN は消えましたが監視はされておらず結果は変わりませんでした。

かれこれ数時間はまってしまっております。
どなたかご回答頂ければ幸いです。
よろしくお願いいたします。

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

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

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

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

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

guest

回答1

0

terminal

1npm install

はどうでしょうか?

投稿2021/08/13 10:16

編集2021/08/13 10:18
uhoenginia

総合スコア13

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問