新しいReactプロジェクトでブートストラップを追加しようとしていました。 npmをインストールした後、ブートストラップと反応ブートストラップを実行した後、私のプロジェクトでwebpackを実行しましたが、このエラーが発生します：何が問題なのでしょうか？このWebpackローダーエラーが発生するのはなぜですか？
/home/dove/projects/yulu/node_modules/loader-runner/lib/loadLoader.js:35 throw new Error("Module '" + loader.path + "' is not a loader (must have normal or pitch function)");
^
Error: Module '/home/dove/projects/yulu/node_modules/url/url.js' is not a loader (must have normal or pitch function) at loadLoader (/home/dove/projects/yulu/node_modules/loader-runner/lib/loadLoader.js:35:10) at iteratePitchingLoaders (/home/dove/projects/yulu/node_modules/loader-runner/lib/LoaderRunner.js:169:2) at runLoaders (/home/dove/projects/yulu/node_modules/loader-runner/lib/LoaderRunner.js:362:2) at NormalModule.doBuild (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModule.js:181:3) at NormalModule.build (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModule.js:274:15) at Compilation.buildModule (/home/dove/projects/yulu/node_modules/webpack/lib/Compilation.js:149:10) at factoryCallback (/home/dove/projects/yulu/node_modules/webpack/lib/Compilation.js:337:12) at factory (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModuleFactory.js:241:5) at applyPluginsAsyncWaterfall (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModuleFactory.js:94:13) at /home/dove/projects/yulu/node_modules/tapable/lib/Tapable.js:268:11 at NormalModuleFactory.params.normalModuleFactory.plugin (/home/dove/projects/yulu/node_modules/webpack/lib/CompatibilityPlugin.js:52:5) at NormalModuleFactory.applyPluginsAsyncWaterfall (/home/dove/projects/yulu/node_modules/tapable/lib/Tapable.js:272:13) at resolver (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModuleFactory.js:69:10) at process.nextTick (/home/dove/projects/yulu/node_modules/webpack/lib/NormalModuleFactory.js:194:7) at _combinedTickCallback (internal/process/next_tick.js:131:7) at process._tickCallback (internal/process/next_tick.js:180:9)
私webpack.config.js
var path = require('path');
var webpack = require('webpack');
module.exports =
{
entry :{
app :'./app/app.jsx',
},
output :{
path : __dirname,
filename: './client/bundle.js'
},
resolve :{
alias : {
//Utilities: path.resolve(__dirname, 'src/utilities/'),
//Templates: path.resolve(__dirname, 'src/templates/')
},
extensions : ['.js','.jsx']
},
module :{
loaders: [
{
test: /.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['es2015', 'react']
},
exclude :/(node_modules|bower_components)/
},
{
test: /\.css$/,
loader: "style-loader!css-loader"
},
{
test: /\.png$/,
loader: "url-loader?limit=100000"
},
{
test: /\.jpg$/,
loader: "file-loader"
},
{
test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url?limit=10000&mimetype=application/font-woff'
},
{
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url?limit=10000&mimetype=application/octet-stream'
},
{
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
loader: 'file'
},
{
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url?limit=10000&mimetype=image/svg+xml'
}
]
}
}
私のpackage.json wepack 2は、それはもはやomit the -loader suffixに許可されていますし、ローダーが文字通り解決されるので
{
"name": "yulu",
"version": "1.0.0",
"description": "This is a business advertising website",
"main": "server.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node server.js"
},
"author": "@magic wand",
"license": "MIT",
"dependencies": {
"bootstrap": "^3.3.7",
"express": "^4.15.4",
"react": "^15.6.1",
"react-bootstrap": "^0.31.2",
"react-dom": "^15.6.1",
"react-router": "^4.1.2"
},
"devDependencies": {
"babel-core": "^6.25.0",
"babel-loader": "^7.1.1",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.4",
"exports-loader": "^0.6.4",
"file-loader": "^0.11.2",
"imports-loader": "^0.7.1",
"node-sass": "^4.5.3",
"postcss-loader": "^2.0.6",
"resolve-url-loader": "^2.1.0",
"sass-loader": "^6.0.6",
"style-loader": "^0.18.2",
"url-loader": "^0.5.9",
"webpack": "^3.5.4"
}
}