const { join, resolve } = require('path');
const path = require('path');
const fs = require('fs-extra');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const scenarioNames = fs.readdirSync(join('./src/scenarios')).filter(name => !name.startsWith('.'));
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
const TerserPlugin = require('terser-webpack-plugin');
module.exports = allConfig => {
const { onGetWebpackConfig } = allConfig;
onGetWebpackConfig(config => {
if (process.env.ANALYZE === 'true') {
config.plugin('webpack-bundle-analyzer').use(BundleAnalyzerPlugin, [
{
// 生成 HTML 报告的目录(默认是 `stats.json` 和 `report.html`)
filename: 'webpack-report.html',
openAnalyzer: true, // 构建完成后自动打开分析器
analyzerMode: 'static', // 使用静态模式生成报告文件
},
]);
}
config.plugin('VueLoaderPlugin').use(VueLoaderPlugin);
config.merge({
module: {
rule: [
{
test: /\.vue$/,
loader: 'vue-loader',
},
],
},
});
config.resolve.plugin('tsconfigpaths').use(TsconfigPathsPlugin, [
{
configFile: './tsconfig.json',
},
]);
config.merge({
node: {
fs: 'empty',
},
});
config.merge({
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
});
scenarioNames.forEach(name => {
const hasTsx = fs.existsSync(join(`./src/scenarios/${name}/index.tsx`));
config.merge({
entry: {
[name]: hasTsx
? require.resolve(`./src/scenarios/${name}/index.tsx`)
: require.resolve(`./src/scenarios/${name}/index.ts`),
},
});
config.plugin(name).use(HtmlWebpackPlugin, [
{
inject: false,
templateParameters: {
scenario: name,
version: new Date().getTime(),
},
template: require.resolve('./public/index.ejs'),
filename: `${name}.html`,
},
]);
});
config.plugin('preview').use(HtmlWebpackPlugin, [
{
inject: false,
templateParameters: {
version: new Date().getTime(),
},
template: require.resolve('./public/preview.html'),
filename: 'preview.html',
},
]);
config.plugin('archive').use(HtmlWebpackPlugin, [
{
inject: false,
templateParameters: {
version: new Date().getTime(),
},
template: require.resolve('./public/archive.html'),
filename: 'archive.html',
},
]);
config.plugin('eaccountingArchive').use(HtmlWebpackPlugin, [
{
inject: false,
templateParameters: {
version: new Date().getTime(),
},
template: require.resolve('./public/eaccountingArchive.html'),
filename: 'eaccountingArchive.html',
},
]);
config.plugin('appending').use(HtmlWebpackPlugin, [
{
inject: false,
templateParameters: {
version: new Date().getTime(),
},
template: require.resolve('./public/appending.html'),
filename: 'appending.html',
},
]);
config.plugin('CopyWebpackPlugin').tap(([args]) => {
console.log('args',args)
return [
[
{
...(args[0] || {}),
},
],
];
});
config.plugins.delete('hot');
config.devServer.hot(false);
const proxyHost = 'http://kwesit.huawei.com'; // siT环境
config.devServer.proxy({
'/efinance/icp/xapp/designer': {
target: proxyHost,
// logLevel: 'debug',
changeOrigin: true,
secure: false,
},
'/efinance/icp/xapp/material': {
target: proxyHost,
// logLevel: 'debug',
changeOrigin: true,
secure: false,
},
'/icp/comment': {
target: proxyHost,
// logLevel: 'debug',
changeOrigin: true,
secure: false,
},
'/efinance/icp/cardmaker': {
target: proxyHost,
// logLevel: 'debug',
changeOrigin: true,
secure: false,
},
'/fin/front/one/gw': {
target: proxyHost,
changeOrigin: true,
secure: false,
},
'/efinance/icp/cardmaker/services/metadata': {
target: proxyHost,
changeOrigin: true,
secure: false,
},
'/efinance/icp/designstudio/services/jalor/lookup': {
target: proxyHost,
changeOrigin: true,
secure: false,
},
});
// config.optimization.minimize(true),
config.module // fixes https://github.com/graphql/graphql-js/issues/1272
.rule('mjs$')
.test(/\.mjs$/)
.include.add(/node_modules/)
.end()
.type('javascript/auto');
if (process.env.DEV !== 'true') {
config.optimization.splitChunks({
name: 'vendor',
chunks: 'all',
cacheGroups: {
vendor: {
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
enforce: true,
},
},
});
// config.optimization.usedExports(true);
config.optimization
.minimize(true)
.minimizer('terser')
.use(TerserPlugin, [
{
terserOptions: {
compress: {
pure_funcs: ['console.log'], // 可选:删除调试日志
},
output: {
comments: false, // 可选:删除文件注释
},
mangle: {
toplevel: true,
},
},
parallel: true,
},
]);
}
});
};
,build使用 @alib/build-scripts,能否通过配置调整,使得这个项目模板中的script标签都通过打包构建时自动生成?,打包文件带上哈希值,利用好浏览器缓存
最新发布