在 Vue.js 中找不到这些依赖项错误 [英] These dependencies were not found error in Vue.js

问题描述

更新 npm & 后node 到他们的最新版本，当我尝试运行我的 vue 项目时出现以下错误:

After updating npm & node to their last versions, I get following errors when I try to run my vue project:

未找到这些依赖项:

• !!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在/home/projects/wisaweb/trunk/app/modules/wisaapp/login/login.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 文件都出现相同的错误，如下所示:

I get same errors for all of my vue files, which all look like as follows:

登录.vue:

<template src="wisaapp/login/login.html"></template>
<script src="wisaapp/login/login.js"></script>
<style src="wisaapp/login/login.css" scoped></style>

我写的第一条错误消息是针对 vue 文件中引用的 css 文件.对于 js 文件，我收到以下错误:

The first error message I wrote was for referred css files in vue file. For js files I get the following error:

• !!babel-loader!wisaapp/login/login.js 在/home/projects/wisaweb/trunk/app/modules/wisaapp/login/login.vue 中

.js 和 .css 文件的路径在相对之前，但没有任何区别.

The path for .js and .css files were before relative but it didn't make any difference.

有什么问题?

这是我的 package.json:

Here is my 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

npm version : 5.4.1

nodejs 版本:0.10.25

nodejs version: 0.10.25

更新

我试过了:

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，我会得到如下类似的错误:

If I run npm run build, I get the similar errors as follows:

错误在/home/builder/build/release/projects/wisaweb/connection-maker.vue未找到模块:错误:无法解析vue-style-loader"'/home/builder/build/release/projects/wisaweb/connection-maker'@/home/builder/build/release/projects/wisaweb/connection-maker.vue3:0-372 @ ./src/router/index.js @ ./src/main.js @ multi./build/prod-client ./src/main.js

ERROR in /home/builder/build/release/projects/wisaweb/connection-maker.vue Module not found: Error: Can't resolve 'vue-style-loader' in '/home/builder/build/release/projects/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找不到模块:错误:无法解析babel-loader"'/home/builder/build/release/projects/wisaweb/todolist'@/home/builder/build/release/projects/wisaweb/todolist.vue7:2-99 @ ./src/router/index.js @ ./src/main.js @ multi./build/prod-client ./src/main.js

ERROR in /home/builder/build/release/projects/wisaweb/todolist.vue Module not found: Error: Can't resolve 'babel-loader' in '/home/builder/build/release/projects/wisaweb/todolist' @ /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 对这个问题的建议是:

What npm recommends about the problem is:

要安装它们，您可以运行: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

To install them, you can run: 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

推荐答案

我今天遇到了同样的问题.在我重命名具有 ! 的父文件夹之前，我找不到解决方案.(感叹号)在其名称中.我删除了一个感叹号，一切都开始工作了！

I had the same issue today. I could'nt find solution until I renamed the parent folder which had ! (exclamation mark) in its name. I removed an exclamation mark and everything started to work!

这篇关于在 Vue.js 中找不到这些依赖项错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！