新しいPCでVueの開発サーバーを立ち上げたいがうまく起動できない。
Q&A
解決したいこと
VueJs2でWebサイトを開発しております。
新しく購入したノートパソコンでも開発をしたいと思い、githubでデータを引っ張ってきた後、「npm run serve」のコマンドでテストサーバーを立ち上げようとしたところ、以下のようなエラーが起きてしまい立ち上げられませんでした。
発生している問題・エラー
Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
"exclude": [
null
],
"use": [
{
"loader": "D:\\data_private_sourcecode\\circlesite\\node_modules\\@vue\\cli-plugin-babel\\node_modules\\cache-loader\\dist\\cjs.js",
"options": {
"cacheDirectory": "D:\\data_private_sourcecode\\circlesite\\node_modules\\.cache\\babel-loader",
"cacheIdentifier": "5c7f13d2"
},
"ident": "clonedRuleSet-39.use[0]"
},
{
"loader": "D:\\data_private_sourcecode\\circlesite\\node_modules\\babel-loader\\lib\\index.js",
"options": "undefined",
"ident": "undefined"
}
]
}
Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
"exclude": [
null
],
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\data_private_sourcecode\circlesite\node_modules\@vue\cli-service\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:24:1)
at AsyncSeriesHook.lazyCompileHook (D:\data_private_sourcecode\circlesite\node_modules\@vue\cli-service\node_modules\tapable\lib\Hook.js:154:20)
at Watching._go (D:\data_private_sourcecode\circlesite\node_modules\@vue\cli-service\node_modules\webpack\lib\Watching.js:41:32)
at D:\data_private_sourcecode\circlesite\node_modules\@vue\cli-service\node_modules\webpack\lib\Watching.js:33:9
at Compiler.readRecords (D:\data_private_sourcecode\circlesite\node_modules\@vue\cli-service\node_modules\webpack\lib\Compiler.js:529:11)
自分で試したこと
自分で調べてみたところ、インストールされているWebpackのばーしょんが違うことが原因(?)との記事が見つかったので調べてみました。
使用中のPC(問題なく動く)
npm wabpack -v
7.10.0
新しいPC(起動できない)
npm wabpack -v
9.3.1
バージョンにずれがあったため、新しいPCのほうのバージョンを合わせてみようとしましたが、以下のようなエラーが出ました。
npm install webpack@7.10.0 --save
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: home@0.1.0
npm WARN Found: webpack@5.75.0
npm WARN node_modules/webpack
npm WARN peer webpack@"^4.0.0 || ^5.0.0" from @soda/friendly-errors-webpack-plugin@1.8.1
npm WARN node_modules/@soda/friendly-errors-webpack-plugin
npm WARN @soda/friendly-errors-webpack-plugin@"^1.7.1" from @vue/cli-service@4.5.19
npm WARN node_modules/@vue/cli-service
npm WARN 10 more (babel-loader, copy-webpack-plugin, css-loader, ...)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer webpack@"^5.0.0" from sass-loader@12.6.0
npm WARN node_modules/sass-loader
npm WARN dev sass-loader@"^12.1.0" from the root project
npm ERR! code ETARGET
npm ERR! notarget No matching version found for webpack@7.10.0.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\alex7\AppData\Local\npm-cache\_logs\2023-02-08T06_55_11_336Z-debug-0.log
エラーメッセージを見る感じ、指定したバージョンが存在しておらず、最新バージョンも調べたところ5.75のようでした。(そもそもこのコマンドで表示されているのはwebpackのバージョンではないのでしょうか？)
どなたか解決方法をご教示いただけますと幸いです。「
0 likes
