Npmとnodeを最新バージョンに更新した後、vueプロジェクトを実行しようとすると、次のエラーが発生します。
これらの依存関係は見つかりませんでした:
- !! vue-style-loader!css-loader!../../../../../../../../../ swlkagenda/1.2.0/build/node_modules/vue -loader/lib/style-rewriter?id = data-v-c906422a&scoped = true!wisaapp/login/login.css in/home/projects/wisaweb/trunk/app/modules/wisaapp/login /login.vue
すべてのvueファイルで同じエラーが発生します。これらはすべて次のようになります。
Login.vue:
<template src="wisaapp/login/login.html"></template>
<script src="wisaapp/login/login.js"></script>
<style src="wisaapp/login/login.css" scoped></style>
私が書いた最初のエラーメッセージは、vue file内の参照されたcss
ファイルに対するものでした。js
ファイルの場合、次のエラーが発生します。
- !! babel-loader!wisaapp/login/login.js in /home/projects/wisaweb/trunk/app/modules/wisaapp/login/login.vue
.js
ファイルと.css
ファイルのパスは相対パスより前でしたが、違いはありませんでした。
何が悪いのでしょうか?
これが私のpackage.jsonです:
{
"name" : "",
"version" : "",
"description" : "",
"author" : "",
"private" : true,
"scripts" : {
"dev" : "node build\/dev-server.js",
"build" : "node build\/build.js",
"unit" : "cross-env BABEL_ENV=test karma start test\/unit\/karma.conf.js --single-run",
"e2e" : "node test\/e2e\/runner.js",
"test" : "npm run unit && npm run e2e",
"lint" : "eslint --ext .js,.vue src test\/unit\/specs test\/e2e\/specs"
},
"dependencies" : {
"axios" : "^0.15.3",
"vue-axios" : "^1.2.2",
"lodash" : "^4.17.4",
"uglify-js" : "git+https:\/\/github.com\/mishoo\/UglifyJS2.git#harmony",
"vue" : "^2.1.10",
"vue-router" : "^2.2.0",
"vue-style-loader" : "^2.0.4",
"vue-touch" : "^2.0.0-beta.4",
"vuex" : "^2.1.2",
"wisaapp" : "./../../../../wisaweb_trunk/app/modules/wisaapp",
"wisaapp-agenda-common" : "wisaapp-agenda-common"
},
"devDependencies" : {
"autoprefixer" : "^6.7.2",
"babel-core" : "^6.22.1",
"babel-eslint" : "^7.1.1",
"babel-loader" : "^6.2.10",
"babel-plugin-transform-runtime" : "^6.22.0",
"babel-preset-es2015" : "^6.22.0",
"babel-preset-stage-2" : "^6.22.0",
"babel-register" : "^6.22.0",
"chalk" : "^1.1.3",
"connect-history-api-fallback" : "^1.3.0",
"css-loader" : "^0.26.1",
"eslint" : "^3.14.1",
"eslint-friendly-formatter" : "^2.0.7",
"eslint-loader" : "^1.6.1",
"eslint-plugin-html" : "^2.0.0",
"eslint-config-standard" : "^6.2.1",
"eslint-plugin-promise" : "^3.4.0",
"eslint-plugin-standard" : "^2.0.1",
"eventsource-polyfill" : "^0.9.6",
"express" : "^4.14.1",
"extract-text-webpack-plugin" : "^2.0.0-rc.2",
"file-loader" : "^0.10.0",
"friendly-errors-webpack-plugin" : "^1.1.3",
"function-bind" : "^1.1.0",
"html-webpack-plugin" : "^2.28.0",
"http-proxy-middleware" : "^0.17.3",
"webpack-bundle-analyzer" : "^2.2.1",
"cross-env" : "^3.1.4",
"karma" : "^1.4.1",
"karma-coverage" : "^1.1.1",
"karma-mocha" : "^1.3.0",
"karma-phantomjs-launcher" : "^1.0.2",
"karma-sinon-chai" : "^1.2.4",
"karma-sourcemap-loader" : "^0.3.7",
"karma-spec-reporter" : "0.0.26",
"karma-webpack" : "^2.0.2",
"lolex" : "^1.5.2",
"mocha" : "^3.2.0",
"chai" : "^3.5.0",
"sinon" : "^1.17.7",
"sinon-chai" : "^2.8.0",
"inject-loader" : "^2.0.1",
"babel-plugin-istanbul" : "^3.1.2",
"phantomjs-prebuilt" : "^2.1.14",
"chromedriver" : "^2.27.2",
"cross-spawn" : "^5.0.1",
"nightwatch" : "^0.9.12",
"Selenium-server" : "^3.0.1",
"semver" : "^5.3.0",
"opn" : "^4.0.2",
"ora" : "^1.1.0",
"shelljs" : "^0.7.6",
"url-loader" : "^0.5.7",
"vue-loader" : "^10.3.0",
"vue-style-loader" : "^2.0.0",
"vue-template-compiler" : "^2.1.10",
"webpack" : "^2.2.1",
"webpack-dev-middleware" : "^1.10.0",
"webpack-hot-middleware" : "^2.16.1",
"webpack-merge" : "^2.6.1",
"transfer-webpack-plugin" : "^0.1.4"
},
"engines" : {
"node" : ">= 4.0.0",
"npm" : ">= 3.0.0"
}
}
npmバージョン:5.4.1
nodejsバージョン:0.10.25
[〜#〜] update [〜#〜]
私は試した:
npm install css-loader --save
npm install vue-style-loader --save
npm install after deleting node_modules map
deleting all the generated files by build procedure
しかし、それらのどれも機能しませんでした
npm run build
を実行すると、次のようなエラーが発生します。
/home/builder/build/release/projects/wisaweb/connection-maker.vueモジュールにエラーが見つかりません:エラー: '/ home/builder/build/release/projects /の' vue-style-loader 'を解決できませんwisaweb/connection-maker '@ /home/builder/build/release/projects/wisaweb/connection-maker.vue 3:0-372 @ ./src/router/index.js @ ./src/main.js @ multi ./build/prod-client ./src/main.js
/home/builder/build/release/projects/wisaweb/todolist.vueモジュールのエラーが見つかりません:エラー:「/ home/builder/build/release/projects/wisaweb/todolist」の「babel-loader」を解決できません@ /home/builder/build/release/projects/wisaweb/todolist.vue 7:2-99 @ ./src/router/index.js @ ./src/main.js @ multi ./build/prod-client。 /src/main.js
更新2
Npmがこの問題について推奨しているのは次のとおりです。
それらをインストールするには、次のコマンドを実行できます:npm install --save !! vue-style-loader!css-loader!../../../../../../../../。 ./swlkagenda/1.2.0/build/node_modules/vue-loader/lib/style-rewriter?id=data-v-c906422a&scoped=true!wisaapp/src/components/global/login/login.css
今日も同じ問題がありました。があった親フォルダの名前を変更するまで、解決策を見つけることができませんでした。その名前の(感嘆符)。感嘆符を削除すると、すべてが機能し始めました。
peerDependency
が欠落しているようです。これは、NPM 2からアップグレードしたか、インストールで問題が発生した可能性があるため、次のようにします。
npm install css-loader --save-dev
他のすべてが失敗した場合は、プロジェクトからnode_modules
を削除し、新規インストールを実行します:npm install
アプリケーションにvue-loaderを追加し、たとえば「./」で始まる絶対パスを使用できます。
script src="./pathtoyourjsfile.js"
私は同じ問題を抱えていましたが、別の解決策がありました!
問題は、プロジェクトフォルダのパス構造でした。私のパスは次のようになりました(同じマップ名に注意してください)
/website/website/app/../..
パスに同じ名前が含まれないように変更しました解決済み問題。
/site/website/app/../..
エラーが次のようになっていることに注意してください。
someFile.vue [〜#〜] in [〜#〜] anotherFile.vue。
私にとってこれは、anotherFile.vueにsomeFile.vueをインポートしようとしているimportステートメントがあり、パスが間違っていることを意味しました。
したがって、anotherFile.vueファイルのインポートステートメントのパスが正しいことを再確認してください。
例えば:
import PageLayout from "@/layouts/PageLayout.vue"