如何解决Webpack 2.7.0 LoaderRunnerError：模块“ * \ node_modules \ less \ index.js”不是加载程序必须具有法线或音高功能
我有这个使用Webpack 2.7.0由其他人开发的5年以上的Angular 1.5.8项目。当前无法构建。似乎在第一个.css文件的第一个angular-material.css处遇到了错误：
[96] ./~/angular-material/angular-material.css 1.04 kB {0} [built] [failed] [1 error]
再往下，我会收到两个警告：
WARNING in DedupePlugin: This plugin was removed from webpack. Remove it from your configuration.
WARNING in webpack: Using NoErrorsPlugin is deprecated.
Use NoEmitOnErrorsPlugin instead.
...然后是一堆类似的错误（超过500行），其中我仅介绍了第一个错误：
ERROR in ./src/styles/main.less
Module build failed: ModuleBuildError: Module build failed: LoaderRunnerError: Module 'D:\sgn\www\_g\test\node_modules\less\index.js' is not a loader (must have normal or pitch function)
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:43:20)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:165:10)
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:176:18
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:47:3)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:165:10)
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:176:18
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:47:3)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at runLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:365:2)
at NormalModule.doBuild (D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModule.js:179:3)
at NormalModule.build (D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModule.js:268:15)
at Compilation.buildModule (D:\sgn\www\_g\test\node_modules\webpack\lib\Compilation.js:146:10)
at D:\sgn\www\_g\test\node_modules\webpack\lib\Compilation.js:433:9
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:253:5
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:99:14
at D:\sgn\www\_g\test\node_modules\tapable\lib\Tapable.js:268:11
at NormalModuleFactory.<anonymous> (D:\sgn\www\_g\test\node_modules\webpack\lib\CompatibilityPlugin.
js:52:5)
at NormalModuleFactory.applyPluginsAsyncWaterfall (D:\sgn\www\_g\test\node_modules\tapable\lib\Tapab
le.js:272:13)
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:74:11
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:205:8
at processTicksAndRejections (internal/process/task_queues.js:79:11)
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModule.js:192:19
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:367:11
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:172:11
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:43:11)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:165:10)
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:176:18
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:47:3)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:165:10)
at D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:176:18
at loadLoader (D:\sgn\www\_g\test\node_modules\loader-runner\lib\loadLoader.js:47:3)
at iteratePitchingLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:169:2)
at runLoaders (D:\sgn\www\_g\test\node_modules\loader-runner\lib\LoaderRunner.js:365:2)
at NormalModule.doBuild (D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModule.js:179:3)
at NormalModule.build (D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModule.js:268:15)
at Compilation.buildModule (D:\sgn\www\_g\test\node_modules\webpack\lib\Compilation.js:146:10)
at D:\sgn\www\_g\test\node_modules\webpack\lib\Compilation.js:433:9
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:253:5
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:99:14
at D:\sgn\www\_g\test\node_modules\tapable\lib\Tapable.js:268:11
at NormalModuleFactory.<anonymous> (D:\sgn\www\_g\test\node_modules\webpack\lib\CompatibilityPlugin.
js:52:5)
at NormalModuleFactory.applyPluginsAsyncWaterfall (D:\sgn\www\_g\test\node_modules\tapable\lib\Tapab
le.js:272:13)
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:74:11
at D:\sgn\www\_g\test\node_modules\webpack\lib\NormalModuleFactory.js:205:8
at processTicksAndRejections (internal/process/task_queues.js:79:11)
@ ./src/app/app.js 41:0-30
我尝试做的第一件事是从package.json中的所有依赖项中删除所有^组合器，如下所示：
{
"name": "***","version": "1.0.0","description": "***","main": "app.js","scripts": {
"build": "webpack --progress --profile","dev": "webpack-dev-server --inline --open --progress --colors --watch"
},"author": "Dovydas Martusevicius","license": "MIT","dependencies": {
"ajv": "^4.11.2","angular": "1.5.8","angular-animate": "1.5.8","angular-aria": "1.5.8","angular-chart.js": "1.1.1","angular-chartjs": "0.0.5","angular-material": "^1.1.0","angular-material-data-table": "0.10.9","angular-messages": "1.5.8","angular-sanitize": "1.5.8","angular-ui-bootstrap": "2.4.0","angular-ui-router": "0.3.1","animate.css": "3.5.1","babel-polyfill": "6.13.0","less": "^3.9.0","moment": "2.17.1","normalize.css": "4.2.0"
},"devDependencies": {
"autoprefixer-loader": "^3.2.0","babel-core": "^6.14.0","babel-loader": "^6.2.5","babel-preset-es2015-native-modules": "^6.9.4","css-loader": "^0.24.0","extract-text-webpack-plugin": "^2.0.0-beta.3","file-loader": "^0.9.0","html-loader": "^0.4.3","html-webpack-plugin": "^2.22.0","less-loader": "^2.2.3","source-map-loader": "^0.1.5","style-loader": "^0.13.1","webpack": "^2.7.0","webpack-dev-server": "^1.15.0"
}
}
...而且，坦率地说，当我确保使用其依赖项的那些确切版本时，我期望它会构建。但是错误仍然存在。
我尝试的第二件事是降级节点。我最初尝试使用13.11.0，12.18.3，8.11.3和5.12.0构建它。
总体而言，我对webpack不太满意，但是在v2.*方面我完全迷失了。
这是webpack配置：
'use strict';
//Modules
const webpack = require('webpack');
const path = require('path');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
//Environment
const env = process.env.npm_lifecycle_event;
var isTest = env === 'test' || env === 'test-watch';
var isProd = env === 'build';
module.exports = {
devtool: 'source-map',entry: {
app: './src/app/app.js'
},devServer: {
outputPath: path.join(__dirname,'src'),contentBase: "./src"
},output: {
path: path.resolve(__dirname,'dist'),publicPath: isProd ? '' : 'http://localhost:8080/',filename: isProd ? 'js/[name].[hash].js' : 'js/[name].bundle.js',chunkFilename: isProd ? 'js/[name].[hash].js' : 'js/[name].bundle.js'
},resolve: {
// you can load named modules from any dirs you want.
// attempts to find them in the specified order.
modules: [
'./src/lib','node_modules'
]
},module: {
loaders: [
//HTML Files
{
test: /\.html$/,loader: 'html-loader'
},//Transpile ES6 to ES5
{
test: /\.js$/,include: path.join(__dirname,exclude: /node_modules/,loader: 'babel-loader',query: {
presets: [
["es2015",{"module": false}]
]
}
},//Extract Normal CSS
{
test: /\.css$/,loader: ExtractTextPlugin.extract('css-loader?sourceMap!autoprefixer')
},//Bundle Less into CSS Code
{
test: /\.less$/,loader: ExtractTextPlugin.extract('css-loader?sourceMap!autoprefixer!less?sourceMap')
},//Images
{
test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/,loader: 'file-loader'
}
]
},plugins : (() => {
let plugins = [];
//Render Index.html,Extract CSS
plugins.push(
new HtmlWebpackPlugin({
template: './src/index.html',inject: 'body'
}),// Write out CSS bundle to its own file:
new ExtractTextPlugin({
filename: 'css/styles.css',allChunks: true})
);
//If prod do extra stuff
if (isProd) {
plugins.push(
// Only emit files when there are no errors
new webpack.NoErrorsPlugin(),// Dedupe modules in the output
new webpack.optimize.DedupePlugin(),// Minimize JS
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},output: {
comments: false
},sourceMap: true
})
/*new CopyWebpackPlugin([{
from: __dirname + '/src/public'
}])*/
)
}
return plugins;
})()
};
我已经花了很多时间阅读与webpack及其加载器有关的github问题，但是没有发现任何可以提示我正确方向的东西。
感谢您花费时间研究此问题以及您可能有的建议。
解决方法
如果问题仅与特定模块有关，则可以执行以下操作
1-重新安装该特定模块（先删除，然后安装）。
2-尝试升级或降级模块版本。
考虑到该项目目前已有5年的历史，我想更改版本可能会解决您的问题。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
