我的应用程序中有两个配置文件,一个需要单独捆绑,或者根本不捆绑,而是复制到输出文件夹中,然后由主捆绑以某种方式读取。
我已经设法将我的文件放入一个单独的配置包中,但问题是这些文件仍然捆绑在主包中,实际上使我的配置包无用。
我已经设法在@chase的帮助下让config包工作,但我还不高兴。接下来,我想知道如何使这些文件完全不捆绑在一起,但在部署之后仍然可以用于主捆绑包。
有什么建议吗?
我的项目文件夹/文件结构(基本位):
- app
- js
- components
- [all of my components]
- config
- [my config files that I want to isolate]
- App.jsx
- index.jsx
- ...
- ...
我的网络包配置:
const path = require('path')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const cwd = process.cwd()
const mode = 'production'
const CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
context: path.join(cwd, 'app'),
mode,
optimization: {
runtimeChunk: 'single',
minimize: false,
splitChunks: {
chunks: 'all',
maxInitialRequests: Infinity,
minSize: 0,
cacheGroups: {
config: {
test: /[\\/]app[\\/]js[\\/]config[\\/]/,
minSize: 0
},
vendors: {
test: /[\\/]node_modules[\\/]/,
name(module) {
// get the name. E.g. node_modules/packageName/not/this/part.js
// or node_modules/packageName
const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
// npm package names are URL-safe, but some servers don't like @ symbols
return `npm.${packageName.replace('@', '')}`;
},
}
},
},
},
entry: {
app: ["babel-polyfill", './js/index.jsx'],
silentRenew: ["./silent_renew/silent_renew.js"],
},
output: {
path: path.resolve('dist'),
filename: 'bundle_[name].js'
},
module: {
rules: [{
test: /\.jsx?$/,
use: ['babel-loader'],
exclude: /node_modules/
},
{
test: /\.json$/,
use: ['json-loader'],
exclude: /node_modules/
},
{
test: /\.css$/,
use: [
'style-loader',
'css-loader'
]
},
{
test: /\.less$/,
use: [
'style-loader',
'css-loader',
'less-loader'
]
},
{
test: /\.scss$/,
use: [
'style-loader',
'css-loader',
'scss-loader'
]
},
{
test: /\.(png|jpg|jpeg|svg|gif)$/,
use: [
'file-loader'
]
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: [
'file-loader'
]
},
{
test: /\.(pptx|zip)$/,
loader: "file-loader",
options: {
name: '[name].[ext]'
}
}]
},
plugins: [
new CleanWebpackPlugin(['dist']),
new HtmlWebpackPlugin({
template: './index.ejs',
excludeChunks: ["silentRenew"],
}),
new HtmlWebpackPlugin({
template: "./silent_renew/silent_renew.html",
chunks: ["silentRenew",],
filename: "silent_renew.html"
}),
new webpack.DefinePlugin({
CONSTANTS: {
PROD: false,
TEST: true,
DEV: false
}
}),
new webpack.IgnorePlugin(/^(fs|ipc|ignore)$/)
]
}
我希望我的配置文件进入配置包,这已经开始工作了。
但是我也需要它们不包含在主包中。
如果我可以让配置文件完全不捆绑在一起,只复制到输出文件夹中,然后通过主(应用)捆绑从中读取,那就更好了。
但是独立的配置包是第二个选项。