我有一些我想在开发模式下提供的模拟数据文件,但是从我的包中排除。
我的项目结构是:
/src/
index.html
Router.jsx
/components
/mockdata <- I don't need this guy in my bundle.js
是否可以从我的捆绑包中排除/mockdata
目录,但仍然可以通过webpack-dev-server提供文件?我没有在webpack文档的输出部分看到任何内容,但我希望有一个解决方法。
/mockdata
目录中的文件是通过ajax加载的。我的webpack配置分为两部分:
开发
// webpack.config.js
/*eslint-env node*/
var path = require('path');
var webpack = require('webpack');
module.exports = {
devServer: {
historyApiFallback: true,
port: 3000
},
entry: './src/Router.jsx',
output: {
filename: 'bundle.js',
path: path.join(__dirname, 'dist')
},
plugins: [
new webpack.ProvidePlugin({
React: "react"
})
],
module: {
loaders: [
{
test: /\.(css|less)$/,
loader : 'style!css!less'
},
{
test: /\.(js|jsx|es6)$/,
exclude: /node_modules/,
loader: 'babel'
},
{
test: /\.html$/,
loader: 'file?name=[name].[ext]'
}
]
},
resolve: {
root: path.resolve(path.join(__dirname, 'src')),
modulesDirectories: [
'node_modules'
],
extensions: ['', '.js', '.jsx', '.es6']
}
};
和生产:
// webpack.prod.config.js
var config = require('./webpack.config.js');
var webpack = require('webpack');
var CopyWebpackPlugin = require('copy-webpack-plugin');
config.plugins.push(
new webpack.DefinePlugin({
"process.env": {
"NODE_ENV": JSON.stringify("production")
}
})
);
config.plugins.push(
new webpack.optimize.DedupePlugin()
);
config.plugins.push(
new webpack.optimize.OccurenceOrderPlugin()
);
config.plugins.push(
new webpack.optimize.MinChunkSizePlugin({
minChunkSize: 51200, // ~50kb
})
);
config.plugins.push(
new webpack.optimize.UglifyJsPlugin({
mangle: true,
compress: {
warnings: false
},
output: {
comments: false
}
})
);
config.plugins.push(
new CopyWebpackPlugin([
{
from: 'src/static',
to: 'static'
},
{
from: 'src/index.html'
}
])
);
module.exports = config;