rt-sim-training-client/vue.config.js

198 lines
8.0 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// import { getBasePathConfig } from '@/utils/baseUrl'
const path = require('path');
const defaultSettings = require('./src/settings.js');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
// http://127.0.0.1:8888/ 分析打包模块可视化
const name = defaultSettings.title; // page title
const port = 9527; // dev port
let publicPath = '';
let outputDir = '';
(function () {
publicPath = process.env.VUE_APP_PRO == 'local' || process.env.VUE_APP_PRO == 'ntyl' ? '/' : '/cbtc';
outputDir = process.env.VUE_APP_PRO == 'local' || process.env.VUE_APP_PRO == 'ntyl' ? 'dist' : 'dist/cbtc';
})();
// All configuration item explanations can be find in https://cli.vuejs.org/config/
module.exports = {
/**
* You will need to set publicPath if you plan to deploy your site under a sub path,
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
* then publicPath should be set to "/bar/".
* In most cases please use '/' !!!
* Detail: https://cli.vuejs.org/config/#publicpath
*/
publicPath: publicPath,
outputDir: outputDir,
assetsDir: 'static', // 相对于outputDir的静态资源(js、css、img、fonts)目录
lintOnSave: false,
productionSourceMap: false, // 项目打包后是否压缩
devServer: {
port: port,
host: '0.0.0.0',
disableHostCheck: true,
hotOnly: true,
overlay: {
warnings: false,
errors: true
}
// proxy: {
// // change xxx-api/login => mock/login
// // detail: https://cli.vuejs.org/config/#devserver-proxy
// [process.env.VUE_APP_BASE_API]: {
// target: `http://localhost:${port}/mock`,
// changeOrigin: true,
// pathRewrite: {
// ['^' + process.env.VUE_APP_BASE_API]: ''
// }
// }
// }
},
// css: {
// extract: true, // 是否使用css分离插件 ExtractTextPlugin
// sourceMap: false, // 开启 CSS source maps?
// loaderOptions: {
// css: {}, // 这里的选项会传递给 css-loader
// postcss: {} // 这里的选项会传递给 postcss-loader
// }, // css预设器配置项
// modules: false // 启用 CSS modules for all css / pre-processor files.
// },
// parallel: require('os').cpus().length > 1, // 是否为 Babel 或 TypeScript 使用 thread-loader。该选项在系统的 CPU 有多于一个内核时自动启用,仅作用于生产构建。
configureWebpack: config => {
// const appTarget = process.env.VUE_APP_PRO == 'local' ? 'HEB' : 'Common'; // 其他环境变量 区分配置
// config.plugins.push(new webpack.NormalModuleReplacementPlugin(/(.*)_APP_TARGET(\.*)/,
// function (resourse) {
// resourse.request = resourse.request.replace(/APP_TARGET/, `${appTarget}`);
// })
// );
if (process.env.NODE_ENV != 'development') {
config.mode = 'production';
Object.assign(config, {
output:{
...config.output,
filename: `static/js/[name].[hash:6].js`,
chunkFilename: `static/js/[name].[chunkhash:6].js`
}
});
} else {
// 为开发环境修改配置...
config.mode = 'development';
config.name = name;
}
config.resolve = {
extensions: ['.js', '.vue', '.json'],
alias: { // 添加别名
'@': path.resolve('src')
}
};
config.plugins.push(new CopyWebpackPlugin([
{
from: path.resolve(__dirname, './static'),
to: 'static',
ignore: ['.*']
}
]));
// config.plugins.push(new BundleAnalyzerPlugin());
config.externals = {}; // 配置CDN使用
},
// webpack配置
chainWebpack(config) {
// // 修复HMR
// config.resolve.symlinks(true);
config.plugins.delete('preload'); // TODO: need test
config.plugins.delete('prefetch'); // 移除 prefetch 插件 预先加载模块
// set svg-sprite-loader
config.module
.rule('svg')
.exclude.add(path.resolve('src/icons'))
.end();
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(path.resolve('src/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end();
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true;
return options;
})
.end();
config
// https://webpack.js.org/configuration/devtool/#development
.when(process.env.NODE_ENV === 'development',
config => config.devtool('cheap-source-map')
);
config
.when(process.env.NODE_ENV !== 'development',
config => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end();
config
.optimization.splitChunks({
chunks: 'all', // async表示抽取异步模块all表示对所有模块生效initial表示对同步模块生效
maxInitialRequests: Infinity,
minSize: 300000, // 依赖包超过300000bit将被单独打包 当模块 大于30kb
minChunks: 1, // 打包⽣生成的chunk⽂文件最少有⼏几个chunk引⽤用了了这个模块
automaticNameDelimiter:'-', // 打包分割符号
cacheGroups: {
vendors: {
test: /[\\/]node_modules[\\/]/,
name(module) {
const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
return `split-chunk.${packageName.replace('@', '')}`;
},
priority: 10, // 缓存组优先级 数字越⼤大,优先级越⾼高
reuseExistingChunk: true // 如果当前代码块包含的模块已经有了,就不在产生一个新的代码块
},
jmapNew: {
name: 'split-jmapNew',
test: path.resolve(__dirname, './src/jmapNew'),
priority: 9,
minChunks: 1,
reuseExistingChunk: true
},
jlmap3d: {
name: 'split-jlmap3d',
test: path.resolve(__dirname, './src/jlmap3d'),
priority: 7,
minChunks: 1,
reuseExistingChunk: true
}
}
});
config.optimization.runtimeChunk('single');
}
);
}
};