123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244 |
- const fs = require('fs');
- const path = require('path')
- const webpack = require('webpack')
- const createThemeColorReplacerPlugin = require('./config/plugin.config')
- // gzip ѹ��
- const compressionWebpackPlugin = require('compression-webpack-plugin');
- // js,css ѹ��
- const TerserPlugin = require('terser-webpack-plugin');
- // �汾�Զ�����
- const WebpackVersionPlugin = require('webpack-version-plugin');
- const versionConfig = require(resolve('public/version.json'));
- function resolve (dir) {
- return path.join(__dirname, dir)
- }
- /**
- * check production or preview(pro.loacg.com only)
- * @returns {boolean}
- */
- function isProd () {
- return process.env.NODE_ENV === 'production'
- }
- // ��Ŀ������ᅣ1�7
- // Ĭ������£����Ǽ������Ӧ�ý�����������ĸ�Ŀ¼�ᅣ1�7
- // ���磺https://www.my-app.com/
- // Ĭ�ϣ�'/'
- // �������Ӧ�ó���������·���У�����Ҫ����ָ����·�ᅣ1�7
- // ���磺https://www.foobar.com/my-app/
- // ��Ҫ������Ϊ'/my-app/'
- const BASE_URL = isProd ? '/' : '/'
- const assetsCDN = {
- css: [],
- // https://unpkg.com/browse/vue@2.6.10/
- js: [
- '//vuepkg.oss-cn-beijing.aliyuncs.com/vue.min.js',
- '//vuepkg.oss-cn-beijing.aliyuncs.com/vue-router.min.js',
- '//vuepkg.oss-cn-beijing.aliyuncs.com/vuex.min.js',
- '//vuepkg.oss-cn-beijing.aliyuncs.com/axios.min.js',
- // '//vuepkg.oss-cn-beijing.aliyuncs.com/lodash.min.js',
- '//vuepkg.oss-cn-beijing.aliyuncs.com/echarts.min.js'
- ]
- }
- // webpack build externals
- const prodExternals = {
- vue: 'Vue',
- 'vue-router': 'VueRouter',
- vuex: 'Vuex',
- axios: 'axios',
- echarts: 'echarts',
- // lodash : {
- // commonjs: "lodash",
- // amd: "lodash",
- // root: "_" // indicates global variable
- // },
- 'mockjs2': 'Mock'
- }
- // vue.config.js
- const vueConfig = {
- runtimeCompiler: true, // ��̬������ᅣ1�7
- publicPath: BASE_URL,
- configureWebpack: {
- optimization: isProd() ? {
- minimize: true,
- minimizer: [new TerserPlugin({
- test: /\.js(\?.*)?$/i, //ƥ�����ѹ�����ļᅣ1�7
- parallel: true, //ʹ�ö���̲������ᅣ1�7
- terserOptions: { //Terser ѹ������
- output:{comments: false},
- compress: {//consoleɾ��
- pure_funcs: ["console.log"]
- }
- },
- extractComments: true, //��ע�Ͱ��뵽�������ļ���
- })],
- }:{},
- // webpack plugins
- plugins: [
- // Ignore all locale files of moment.js
- new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
- new compressionWebpackPlugin({
- //[file] �ᱻ�滻��ԭʼ��Դ��[path] �ᱻ�滻��ԭʼ��Դ��·���� [query] �ᱻ�滻�ɲ�ѯ�ַ�����Ĭ��ֵ�� "[path].gz[query]"��
- filename: '[path].gz[query]', // ��ʾcompression-webpack-plugin@3.0.0�Ļ�asset��Ϊfilename
- //������ function(buf, callback) �����ַ����������ַ�����˵���� zlib ���㷨(���� zopfli ���㷨)��Ĭ��ֵ�� "gzip"��
- algorithm: 'gzip',
- //����ƥ����������Դ���ᱻ������Ĭ��ֵ��ȫ����Դ��
- test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),
- //ֻ�д�С���ڸ�ֵ����Դ�ᱻ��������λ�� bytes��Ĭ��ֵ�� 0��
- threshold: 10240,
- //ֻ��ѹ����С�����ֵ����Դ�Żᱻ������Ĭ��ֵ�ᅣ1�70.8��
- minRatio: 0.8
- }),
- new WebpackVersionPlugin({
- // You must set the cb option
- cb: function(hashMap) {
- if(!isProd()){
- versionConfig.version = new Date().getTime();
- fs.writeFileSync(resolve('./public/version.json'), JSON.stringify(versionConfig, null, 2));
- }
- }
- })
- ],
- // if prod is on, add externals
- externals: isProd() ? prodExternals : {}
- },
- chainWebpack: (config) => {
- config.resolve.alias
- .set('@$', resolve('src'))
- const svgRule = config.module.rule('svg')
- svgRule.uses.clear()
- svgRule
- .oneOf('inline')
- .resourceQuery(/inline/)
- .use('vue-svg-icon-loader')
- .loader('vue-svg-icon-loader')
- .end()
- .end()
- .oneOf('external')
- .use('file-loader')
- .loader('file-loader')
- .options({
- name: 'assets/[name].[hash:8].[ext]'
- })
- // if prod is on
- // assets require on cdn
- if (isProd()) {
- config.plugin('html').tap(args => {
- args[0].cdn = assetsCDN
- return args
- })
- }
-
- config.optimization && config.optimization.splitChunks({
- // ������ᅣ1�7
- chunks: 'all', //��ѡһ��"initial" ��ʼ����"all"(Ĭ�Ͼ���all)��"async"����̬���أ�
- minSize: 30000, // �γ�һ���´������С�����,ֻ�� >= minSize ��bundle�ᱻ��ֳ��ᅣ1�730000
- maxSize: 0, //���֮ǰ������ֵ��Ĭ��΄1�7������������
- minChunks: 1, //������������Ϊ2 ��ôһ����Դ���ٱ��������βſ��Ա���ֳ��ᅣ1�7
- maxAsyncRequests: 5, // ������ص������������
- maxInitialRequests: 4, // һ����������������
- automaticNameDelimiter: '~', // �ļ��������ӷ�
- name: true,
- cacheGroups: {
- // node_modulesģ��ᅣ1�7
- vendors: {
- test: /[\\/]node_modules[\\/]/,
- name: 'chunk-vendors',
- // name(module) {
- // const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
- // return `chunk.${packageName.replace('@', '')}`;
- // },
- chunks: 'all',
- priority: -10,
- },
- // UI�ⵥ����ᅣ1�7
- antDesign: {
- name: 'chunk-antDesign',
- priority: 19, // the weight needs to be larger than libs and app or it will be packaged into libs or app
- test: /[\\/]node_modules[\\/]_?@ant-design(.*)/
- },
- antDesignVue: {
- name: 'chunk-antDesignVue',
- priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
- test: /[\\/]node_modules[\\/]_?ant-design-vue(.*)/
- },
- // �����
- common: {
- name: 'chunk-common',
- minChunks: 2,
- maxSize: 1024, //���֮ǰ������ֵ��Ĭ��΄1�7������������
- priority: -20,
- reuseExistingChunk: true
- }
- }
- });
-
- // ���������Є1�7
- if (process.env.npm_config_report) {
- config.plugin('webpack-bundle-analyzer')
- .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
- .end();
- }
- },
- css: {
- sourceMap: false,
- loaderOptions: {
- less: {
- modifyVars: {
- // less vars,customize ant design theme
- 'primary-color': process.env.VUE_APP_THEME_COLOR,
- 'link-color': process.env.VUE_APP_THEME_COLOR
- // 'border-radius-base': '4px'
- },
- // do not remove this line
- javascriptEnabled: true
- }
- }
- },
- devServer: {
- // development server port 8000
- port: 8000,
- disableHostCheck: true,
- // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
- proxy: {
- '/api': {
- target: 'http://192.168.0.216:8076/qpls-md',
- // target: 'http://p.iscm.360arrow.com/qpls-md',
- // ws: false,
- ws: true,
- changeOrigin: true,
- pathRewrite: {
- '^/api': ''
- }
- }
- },
- watchOptions: {
- ignored: [/node_modules/, /public/],
- }
- },
- // disable source map in production
- productionSourceMap: false,
- assetsDir: 'static',
- lintOnSave: undefined,
- // babel-loader no-ignore node_modules/*
- transpileDependencies: []
- }
- // preview.pro.loacg.com only do not use in your production;
- if (process.env.VUE_APP_PREVIEW === 'true') {
- console.log('VUE_APP_PREVIEW', true)
- // add `ThemeColorReplacer` plugin to webpack plugins
- vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
- }
- module.exports = vueConfig
|