vue.config.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. const {
  2. defineConfig
  3. } = require('@vue/cli-service')
  4. const CompressionWebpackPlugin = require('compression-webpack-plugin')
  5. // 代码压缩
  6. const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
  7. const cdn = {
  8. js: [
  9. // `https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.min.js`,
  10. // `https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.14/index.min.js`,
  11. // `https://cdn.bootcdn.net/ajax/libs/axios/0.17.1/axios.min.js`,
  12. // `https://cdn.bootcdn.net/ajax/libs/vue-router/3.5.1/vue-router.min.js`,
  13. ]
  14. };
  15. const timestamp = new Date().getTime();
  16. module.exports = defineConfig({
  17. devServer:{
  18. // host: 'localhost',
  19. host: '192.168.100.104',
  20. open:true
  21. },
  22. transpileDependencies: true,
  23. lintOnSave: false, //关闭eslint检查
  24. // 具体使用情况还需要看项目的配置
  25. publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  26. assetsDir: 'static',
  27. css: {
  28. extract: {
  29. filename: `assert/css/[name].${timestamp}.css`,
  30. chunkFilename: `assert/css/[name].${timestamp}.css`
  31. }
  32. },
  33. configureWebpack: {
  34. output: {
  35. filename: `assert/js/[name].${timestamp}.js`,
  36. chunkFilename: `assert/js/[name].${timestamp}.js`
  37. },
  38. externals: {
  39. // vue: 'Vue',
  40. // 'vue-router': 'VueRouter',
  41. // axios: 'axios',
  42. // 'element-ui': 'ELEMENT',
  43. },
  44. plugins: [
  45. new CompressionWebpackPlugin({
  46. algorithm: "gzip",
  47. test: /\.js$|\.html$|\.css$/, // 匹配文件名
  48. threshold: 10240, // 对超过10k的数据压缩
  49. deleteOriginalAssets: false, // 不删除源文件
  50. minRatio: 0.8 // 压缩比
  51. }),
  52. new UglifyJsPlugin({
  53. uglifyOptions: {
  54. compress: {
  55. drop_debugger: true,
  56. drop_console: true,
  57. pure_funcs: ['console.log']
  58. },
  59. output: {
  60. // 去掉注释内容
  61. comments: true
  62. }
  63. },
  64. sourceMap: false,
  65. parallel: true
  66. }),
  67. ],
  68. },
  69. chainWebpack: config => {
  70. config.plugin("html").tap(args => {
  71. args[0].cdn = cdn;
  72. return args;
  73. });
  74. }
  75. })