我收到此错误：
//lines
ERROR in ./node_modules/flag-icon-css/css/flag-icon.css
Module build failed: ModuleBuildError: Module build failed: TypeError: Cannot read property 'path' of undefined
at Object.resolveUrlLoader (C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\resolve-url-loader\index.js:38:56)
at runLoaders (C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\webpack\lib\NormalModule.js:195:19)
at C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\loader-runner\lib\LoaderRunner.js:367:11
at C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\loader-runner\lib\LoaderRunner.js:233:18
at runSyncOrAsync (C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\loader-runner\lib\LoaderRunner.js:143:3)
at iterateNormalLoaders (C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\loader-runner\lib\LoaderRunner.js:232:2)
at C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\loader-runner\lib\LoaderRunner.js:205:4
at C:\Users\badri\Desktop\WORK\WASHAJ\washaj\gaca-frontend\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:70:14
at _combinedTickCallback (internal/process/next_tick.js:132:7)
at process._tickCallback (internal/process/next_tick.js:181:9)
//lines
经过2天的更改/升级等，我结束了这个webpack.config.js文件：
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const PATHS = {
app: path.join(__dirname, 'src/js'),
build: path.join(__dirname, 'build'),
public: path.join(__dirname, 'src/public'),
assets: path.join(__dirname, 'src/assets'),
styles: [
path.join(__dirname, 'src/assets/css/bootstrap.min.css'),
path.join(__dirname, 'src/assets/css/font-awesome.min.css'),
path.join(__dirname, 'src/assets/css/bootstrap-grid-rtl.css'),
path.join(__dirname, 'src/assets/css/main.css'),
path.join(__dirname, 'src/assets/css/PrintStyle.css'),
path.join(__dirname, 'node_modules/react-dates/lib/css/_datepicker.css'),
path.join(__dirname, 'node_modules/flag-icon-css/css/flag-icon.css'),
path.join(__dirname, 'src/assets/css/react-datepicker.css'),
path.join(__dirname, 'src/assets/css/tracker.css'),
]
};
const isDebug = !process.argv.includes('--release');
module.exports = {
entry: {
app: ['babel-polyfill',PATHS.app],
style: PATHS.styles
},
output: {
path: PATHS.build,
filename: 'js/[name].js',
},
resolve: {
extensions: ['.css', '.js', '.jsx']
},
module: {
rules: [
{
test: /\.jsx?$/,
use: [
{
loader: "babel-loader",
options: {
cacheDirectory: isDebug,
babelrc: true,
presets: [
'latest',
'react',
...isDebug ? [] : [
'react-optimize',
],
],
plugins: [
'transform-object-rest-spread',
'transform-object-assign',
[
'react-intl', {
'messagesDir': './build/messages',
'enforceDescriptions': false
}
]
]
}
}
],
include: [
path.resolve(__dirname, PATHS.app)
]
},
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
{
loader: 'css-loader',
options: {
importLoaders: 1,
sourceMap: true,
modules: true,
localIdentName: isDebug ? '[name]-[local]-[hash:base64:5]' : '[hash:base64:5]'
}
},
{
loader: 'resolve-url-loader'
},
{
loader: 'postcss-loader'
}
]
}),
exclude: PATHS.styles,
},
{
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-loader',
options: {
localIdentName: isDebug ? '[name]-[local]-[hash:base64:5]' : '[hash:base64:5]'
}
},
{
loader: 'resolve-url-loader'
}
]
}),
exclude: PATHS.app,
include: PATHS.styles
},
{
test: /\.sss$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader'
}
]
},
{
test: /\.json$/,
use: [
{
loader: 'json-loader'
}
]
},
{
test: /\.(eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
use: [
{
loader:
`file-loader?${JSON.stringify({
name: isDebug ? '/[path][name].[ext]?[hash:8]' : '/fonts/[hash:8].[ext]',
})}`
}
]
},
{
test: /\.(ico|jpg|jpeg|png|gif)(\?.*)?$/,
use: [
{
loader:
`file-loader?${JSON.stringify({
name: isDebug ? '/[path][name].[ext]?[hash:8]' : '/images/[hash:8].[ext]'
})}`
}
]
},
],
},
plugins: [
new webpack.LoaderOptionsPlugin({
options: {
context: __dirname,
postcss: [
require('postcss-partial-import')(),
require('postcss-url')(),
require('postcss-custom-properties')(),
require('postcss-custom-media')(),
require('postcss-media-minmax')(),
require('postcss-custom-selectors')(),
require('autoprefixer')({
browsers: [
'>1%',
'last 4 versions',
'Firefox ESR',
'not ie < 9',
],
})
]
}
}),
new webpack.DefinePlugin({
'process.env.NODE_ENV': isDebug ? '"development"' : '"production"',
'process.env.BROWSER': true,
__DEV__: isDebug,
}),
/*new webpack.optimize.UglifyJsPlugin({
compress: {
properties: true
}
}),*/
new ExtractTextPlugin({ filename: '[name].css', allChunks: true , disable: false}),
new OptimizeCssAssetsPlugin({
cssProcessorOptions: { discardComments: {removeAll: true } },
}),
new HtmlWebpackPlugin({
title: 'Washaj Portal',
template: path.join(PATHS.public, 'index.ejs'),
favicon: path.join(PATHS.assets, 'images/favicon.ico'),
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
}),
...isDebug? [
new webpack.HotModuleReplacementPlugin({
multiStep: true
}),
] : [
new CleanWebpackPlugin(PATHS.build, {
root: process.cwd()
}),
new webpack.optimize.OccurrenceOrderPlugin(true),
new webpack.optimize.DedupePlugin()
] //else ends
],
bail: !isDebug,
cache: false,
stats: {
colors: true,
reasons: isDebug,
timings: true,
},
devtool: isDebug ? 'cheap-module-source-map' : false,
devServer: {
historyApiFallback: true,
hot: true,
inline: true,
stats: 'errors-only',
port: 3000,
host: '0.0.0.0',
publicPath: '/',
contentBase: PATHS.build,
proxy: {
'/api/**': {
target: 'http://localhost:8080',
secure: false
}
}
}
};
我想不同插件的版本也没有问题。 有什么办法可以解决这个问题？