【问题标题】:npm run cannot find module 'sass' after repeated reinstall attempts反复重新安装尝试后,npm run 找不到模块“sass”
【发布时间】:2019-05-31 10:25:40
【问题描述】:

npm run 的任何调用都会产生此错误:

$ npm run dev

> @ dev /project
> npm run development


> @ development /project
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

/project/node_modules/webpack-cli/bin/cli.js:235
                throw err;
                ^

Error: Cannot find module 'sass'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:603:15)
    at Function.Module._load (internal/modules/cjs/loader.js:529:25)
    at Module.require (internal/modules/cjs/loader.js:657:17)
    at require (/project/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at implementation (/project/node_modules/laravel-mix/src/components/Sass.js:52:39)
    at implementation (/project/node_modules/laravel-mix/src/components/Preprocessor.js:125:61)
    at global.tap (/project/node_modules/laravel-mix/src/helpers.js:10:5)
    at Sass.loaderOptions (/project/node_modules/laravel-mix/src/components/Preprocessor.js:123:9)
    at extractPlugin (/project/node_modules/laravel-mix/src/components/Preprocessor.js:87:39)
    at global.tap (/project/node_modules/laravel-mix/src/helpers.js:10:5)
    at details.forEach.preprocessor (/project/node_modules/laravel-mix/src/components/Preprocessor.js:27:13)
    at Array.forEach (<anonymous>)
    at Sass.webpackRules (/project/node_modules/laravel-mix/src/components/Preprocessor.js:22:22)
    at ComponentFactory.applyRules (/project/node_modules/laravel-mix/src/components/ComponentFactory.js:155:23)
    at Mix.listen.rules (/project/node_modules/laravel-mix/src/components/ComponentFactory.js:66:48)
    at events.(anonymous function).forEach.handler (/project/node_modules/laravel-mix/src/Dispatcher.js:34:47)
    at Array.forEach (<anonymous>)
    at Dispatcher.fire (/project/node_modules/laravel-mix/src/Dispatcher.js:34:28)
    at Mix.dispatch (/project/node_modules/laravel-mix/src/Mix.js:119:25)
    at WebpackConfig.buildRules (/project/node_modules/laravel-mix/src/builder/WebpackConfig.js:83:13)
    at WebpackConfig.build (/project/node_modules/laravel-mix/src/builder/WebpackConfig.js:23:14)
    at Object.<anonymous> (/project/node_modules/laravel-mix/setup/webpack.config.js:29:38)
    at Module._compile (/project/node_modules/v8-compile-cache/v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Module.require (internal/modules/cjs/loader.js:657:17)
    at require (/project/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at WEBPACK_OPTIONS (/project/node_modules/webpack-cli/bin/convert-argv.js:113:13)
    at requireConfig (/project/node_modules/webpack-cli/bin/convert-argv.js:115:6)
    at /project/node_modules/webpack-cli/bin/convert-argv.js:122:17
    at Array.forEach (<anonymous>)
    at module.exports (/project/node_modules/webpack-cli/bin/convert-argv.js:120:15)
    at yargs.parse (/project/node_modules/webpack-cli/bin/cli.js:232:39)
    at Object.parse (/project/node_modules/yargs/yargs.js:567:18)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

这是我的 package.json:

{
"private": true,
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "npm run development -- --watch",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "accounting": "^0.4.1",
    "axios": "^0.18.0",
    "bootstrap": "^4.1.3",
    "bootstrap-sass": "^3.4.0",
    "cross-env": "^5.2.0",
    "css-loader": "^2.1.0",
    "fancybox": "^3.0.1",
    "jquery": "^3.3.1",
    "jquery-slimscroll": "^1.3.8",
    "ladda": "^2.0.1",
    "laravel-mix": "^4.0.13",
    "locutus": "^2.0.10",
    "metismenu": "^2.7.9",
    "moment": "^2.23.0",
    "resolve-url-loader": "2.3.1",
    "sass-loader": "7.*",
    "style-loader": "^0.23.1",
    "vue": "^2.5.21",
    "vue-template-compiler": "^2.5.21",
    "webpack": "^4.28.3",
    "webpack-cli": "^3.2.0"
  },
  "dependencies": {
    "ajv": "^6.6.2",
    "bootstrap-vue": "^2.0.0-rc.11",
    "bootstrap4c-chosen": "^1.0.13",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "imagemin": "^6.0.0",
    "jsonexport": "^2.4.1",
    "laravel-echo": "^1.5.2",
    "lodash": "^4.17.11",
    "node-sass": "^4.11.0",
    "pusher-js": "^4.3.1",
    "sweetalert2": "^7.32.4",
    "vue-api-query": "^1.2.0",
    "vue-events": "^3.1.0",
    "vue-multiselect": "^2.1.3",
    "vue-sweetalert2": "^1.6.3",
    "vuetable-2": "^2.0.0-beta.4",
    "vuex": "^3.0.1"
  }
}

我的webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .version()
    .sourceMaps();

我已尝试再次删除 node_modulesnpm install,但这并不能解决问题。

rm -rf node_modules
rm package-lock.json yarn.lock
npm cache clear --force
npm install

使用yarn install 而不是 npm 执行相同的过程并不能解决问题。

尝试使用此选项进行安装,但没有成功:npm install node-sass --no-bin-links

  • npm v6.4.1
  • 节点 v11.5.0
  • yarn v1.12.3

这个问题在旧版本的 Webpack 和 Mix 上不会发生。例如,以下软件包可以工作,但显然失去了一些新功能:

"laravel-mix": "^3",
"webpack": "^3.11.0",
"webpack-cli": "^3.1.2"

【问题讨论】:

    标签: node.js npm laravel-mix node-sass


    【解决方案1】:

    从 4.0.0 laravel-mix switched 开始使用 sass 而不是 node-sass

    解决这个问题的两种方法:

    1. 安装sass npm 包:

      npm -g i sass
      
    2. mix 配置为使用node-sass (webpack.mix.js):

      mix.sass('resources/assets/sass/app.scss', 'public/css', {
        implementation: require('node-sass')
      });
      

    【讨论】:

    • 这个解决方案对我不起作用它在上述步骤之后抛出另一个错误“你的系统还不支持节点 sass...”
    • edit :我必须安装 node-sass 作为本地依赖项才能使上述工作。
    • @mufaddal_mw 是的,假设node-sass 已经安装,如问题中所述。
    • 在 webpack.mix.js 中,我将代码从 mix.js('resources/assets/js/app.js', 'public/js').sourceMaps().sass('资源/资产/sass/app.scss','公共/css'); mix.js('resources/assets/js/app.js', 'public/js').sourceMaps(); mix.sass('resources/assets/sass/app.scss', 'public/css', { implementation: require('node-sass') });
    • 为什么当用户运行 npm install 时没有安装,这不是 npm 的重点吗?安装依赖项?
    【解决方案2】:

    ReactJS 使用node-sass,运行以下命令。

    npm install node-sass --save
    

    【讨论】:

    • 为我节省了大量时间。
    【解决方案3】:

    以前我也遇到过同样的问题,但我这样做了,它奏效了

    npm cache clear --force
    npm install sass
    

    我希望这对你有用

    【讨论】:

      【解决方案4】:

      以前我也遇到过同样的问题,但我这样做了,它奏效了 npm install sass

      【讨论】:

      • 这在其他答案中已经提到了。
      猜你喜欢
      • 2020-01-17
      • 2016-08-21
      • 2018-09-10
      • 2018-09-05
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多