node.js - webpack - TypeError : dep. getResourceIdentifier 不是函数

Question

尝试在 laravel 5.6.7 下使用 laravel-mix 2.0.0 和 webpack 4.1.0 进行混合

npm run dev

每次运行都会出现此错误..尝试了常见的解决方法，

• 已删除 npm_modules 文件夹
• npm 缓存清理 --force
• npm 安装

还是一样..

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

0% compiling 10% building modules 0/1 modules 1 active ...krish\node_modules\toastr\toastr.less 10% building modules 1/1 modules 0 active 10% building modules 2/2 modules 0 active 10% building modules 2/3 modules 1 active ...\www\krish\resources\assets\js\app.js 10% building modules 2/5 modules 3 active ...\krish\resources\assets\sass\app.scss 10% building modules 3/6 modules 3 active ...sources\assets\less\adminlte-app.less 10% building modules 4/7 modules 3 active ...krish\node_modules\toastr\toastr.less 10% building modules 5/8 modules 3 active ...otstrap-less\bootstrap\bootstrap.less 10% building modules 6/8 modules 2 active ...sh\resources\assets\js\app-landing.js 10% building modules 6/9 modules 3 active ...krish\node_modules\toastr\toastr.less 10% building modules 6/11 modules 5 active ...\krish\resources\assets\sass\app.scss 10% building modules 6/12 modules 6 active ...sources\assets\less\adminlte-app.less 10% building modules 6/13 modules 7 active ...modules\style-loader\lib\addStyles.js 10% building modules 7/13 modules 6 active ...modules\style-loader\lib\addStyles.js 10% building modules 8/13 modules 5 active ...sources\assets\less\adminlte-app.less 10% building modules 8/14 modules 6 active ...de_modules\css-loader\lib\css-base.js 11% building modules 9/14 modules 5 active ...de_modules\css-loader\lib\css-base.js 11% building modules 10/14 modules 4 active ...de_modules\css-loader\lib\css-base.js 11% building modules 11/14 modules 3 active ...sources\assets\less\adminlte-app.less 11% building modules 11/15 modules 4 active ...node_modules\style-loader\lib\urls.js 11% building modules 11/16 modules 5 active ...h\node_modules\vue\dist\vue.common.js 11% building modules 12/16 modules 4 active ...h\node_modules\vue\dist\vue.common.js 11% building modules 13/16 modules 3 active ...h\node_modules\vue\dist\vue.common.js 11% building modules 14/16 modules 2 active ...sources\assets\less\adminlte-app.lessTypeError: dep.getResourceIdentifier is not a function

at addDependency (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:387:30)
at iterationOfArrayCallback (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:78:3)
at addDependenciesBlock (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:407:5)
at Compilation.processModuleDependencies (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:418:4)
at afterBuild (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:545:16)
at _this.buildModule.err (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:591:11)
at callback (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:342:35)
at module.build.error (C:\wamp\www\krish\node_modules\webpack\lib\Compilation.js:378:12)
at handleParseResult (C:\wamp\www\krish\node_modules\webpack\lib\NormalModule.js:363:12)
at doBuild.err (C:\wamp\www\krish\node_modules\webpack\lib\NormalModule.js:385:6)
at runLoaders (C:\wamp\www\krish\node_modules\webpack\lib\NormalModule.js:264:12)
at C:\wamp\www\krish\node_modules\loader-runner\lib\LoaderRunner.js:370:3
at iterateNormalLoaders (C:\wamp\www\krish\node_modules\loader-runner\lib\LoaderRunner.js:211:10)
at Array.<anonymous> (C:\wamp\www\krish\node_modules\loader-runner\lib\LoaderRunner.js:202:4)
at Storage.finished (C:\wamp\www\krish\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:43:16)
at provider (C:\wamp\www\krish\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:79:9)
at C:\wamp\www\krish\node_modules\graceful-fs\graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:532:3)

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.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\admin\AppData\Roaming\npm-cache_logs\2018-03-05T19_05_05_252Z-debug.log npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! @ dev: npm run development npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the @ dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\admin\AppData\Roaming\npm-cache_logs\2018-03-05T19_05_05_702Z-debug.log

Process finished with exit code 1

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": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "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 --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "lint": "./node_modules/.bin/eslint --ext .js,.vue resources/assets/js"
  },
  "devDependencies": {
    "acacha-forms": "^1.0.0",
    "admin-lte": "^2.4.2",
    "axios": "^0.18.0",
    "babel-eslint": "^8.2.2",
    "babel-loader": "^7.1.3",
    "babel-preset-es2015": "^6.22.0",
    "bootstrap-less": "^3.3.8",
    "bootstrap-sass": "^3.3.7",
    "cross-env": "^5.1.3",
    "eslint": "^4.18.2",
    "eslint-config-standard": "^11.0.0",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^2.0.0",
    "eslint-plugin-html": "^4.0.2",
    "eslint-plugin-promise": "^3.6.0",
    "eslint-plugin-standard": "^3.0.0",
    "font-awesome": "^4.7.0",
    "icheck": "^1.0.2",
    "ionicons": "^3.0.0",
    "jquery": "^3.3.1",
    "laravel-mix": "2.*",
    "less": "^3.0.0",
    "less-loader": "^4.0.6",
    "lodash": "^4.17.5",
    "node-sass": "^4.7.2",
    "sass-loader": "^6.0.7",
    "toastr": "^2.1.4",
    "vue": "^2.5.13",
    "vue-loader": "^14.0.0"
  },
  "dependencies": {
    "ajv": "^6.2.1",
    "bootstrap": "^3.3.7",
    "bootstrap-iconpicker": "^1.8.2",
    "eslint-plugin-import": "^2.9.0",
    "eslint-plugin-node": "^6.0.0",
    "jquery-ui": "^1.12.1",
    "jquery-ui-dist": "^1.12.1",
    "jquery-ujs": "^1.2.2",
    "select2": "^4.0.6-rc.1",
    "vue-template-compiler": "^2.5.13",
    "webpack": "^4.1.0",
    "webpack-cli": "^2.0.10"
  },
  "babel": {
    "presets": [
      "es2015"
    ]
  }
}

更多细节。
Node.js:9.7.1
npm:5.7.1
webpack:4.1.0
操作系统:Win10 32位
除了 bootstrap 之外，所有软件包都是最新的。

引用号:There is no html-webpack-plugin as mentioned here..

Answer 1

Laravel Mix 似乎还不兼容 Webpack 4。我发现我们现在唯一能做的就是切换回 Webpack ^3.11.0。 (通过更改 package.json 中的版本来执行此操作)。

这是一个关于此问题的未决问题:https://github.com/webpack/webpack/issues/6675