vue.config.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. const path = require('path');
  2. const resolve = (dir) => path.join(__dirname, dir);
  3. const CopyWebpackPlugin = require('copy-webpack-plugin');
  4. const webpack = require('webpack');
  5. function extendDefaultPlugins(arr) {
  6. let plug = [
  7. 'removeDoctype',
  8. 'removeXMLProcInst',
  9. 'removeComments',
  10. 'removeMetadata',
  11. 'removeEditorsNSData',
  12. 'cleanupAttrs',
  13. 'mergeStyles',
  14. 'inlineStyles',
  15. 'minifyStyles',
  16. 'cleanupIDs',
  17. 'removeUselessDefs',
  18. 'cleanupNumericValues',
  19. 'convertColors',
  20. 'removeUnknownsAndDefaults',
  21. 'removeNonInheritableGroupAttrs',
  22. 'removeUselessStrokeAndFill',
  23. 'removeViewBox',
  24. 'cleanupEnableBackground',
  25. 'removeHiddenElems',
  26. 'removeEmptyText',
  27. 'convertShapeToPath',
  28. 'convertEllipseToCircle',
  29. 'moveElemsAttrsToGroup',
  30. 'moveGroupAttrsToElems',
  31. 'collapseGroups',
  32. 'convertPathData',
  33. 'convertTransform',
  34. 'removeEmptyAttrs',
  35. 'removeEmptyContainers',
  36. 'mergePaths',
  37. 'removeUnusedNS',
  38. 'sortDefsChildren',
  39. 'removeTitle',
  40. 'removeDesc'
  41. ];
  42. return plug.concat(arr);
  43. }
  44. // 添加less继承
  45. function addStyleResource(rule) {
  46. rule.use('style-resource')
  47. .loader('style-resources-loader')
  48. .options({
  49. patterns: [
  50. resolve('src/assets/styles/common/common.less')
  51. ]
  52. })
  53. }
  54. module.exports = {
  55. publicPath: "./", // 默认'/',部署应用包时的基本 URL
  56. indexPath: 'index.html', // 相对于打包路径index.html的路径
  57. outputDir: 'dist', // 'dist', 生产环境构建文件的目录
  58. assetsDir: 'static', // 相对于outputDir的静态资源(js、css、img、fonts)目录
  59. lintOnSave: false, // 是否在开发环境下通过 eslint-loader 在每次保存时 li
  60. runtimeCompiler: true, // 是否使用包含运行时编译器的 Vue 构建版本
  61. configureWebpack: {
  62. plugins: [
  63. ],
  64. module:{
  65. rules: [
  66. {
  67. test: /\.js$/,
  68. use: {
  69. loader: '@open-wc/webpack-import-meta-loader',
  70. },
  71. },
  72. ]
  73. }
  74. },
  75. chainWebpack: (config) => {
  76. config.resolve.symlinks(true); // 修复热更新失效
  77. config.plugin('html')
  78. .tap(args => {
  79. args[0].title = "智慧光伏集维管理系统";
  80. return args;
  81. })
  82. // 路径别名
  83. config.resolve.alias
  84. .set("@", resolve("src"))
  85. .set("@node", resolve("node_modules"))
  86. .set("@com", resolve("src/components"))
  87. .set("@assets", resolve("src/assets"))
  88. .set("@api", resolve("src/api"))
  89. .set("@store", resolve("src/store"))
  90. .set("@modeConfig", resolve("public/static/config"))
  91. .set("@tools", resolve("src/tools"))
  92. .set("cesium", resolve("node_modules/cesium/Source"));
  93. // less 继承
  94. const types = ['vue-modules', 'vue', 'normal-modules', 'normal'];
  95. types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)));
  96. const metaLoaderRule = config.module.rule('meta-loader');
  97. metaLoaderRule.test(/\.js$/)
  98. .use('@open-wc/webpack-import-meta-loader')
  99. .loader('@open-wc/webpack-import-meta-loader');
  100. // svg 雪碧图
  101. config.module // 排除其他svg-loader
  102. .rule('svg')
  103. .exclude.add(resolve('src/assets/icon/svg'))
  104. .end()
  105. .exclude.add(resolve('src/assets/icon/svg_fill'))
  106. .end();
  107. // svg雪碧图
  108. const svgRule = config.module.rule('icons');
  109. svgRule.test(/\.svg$/)
  110. .include.add(resolve('src/assets/icon/svg'))
  111. .end()
  112. .use('svg-sprite-loader')
  113. .loader('svg-sprite-loader')
  114. .options({
  115. symbolId: 'svg-[name]'
  116. });
  117. // svgo 去除svg中无用元素
  118. svgRule.use('svgo-loader').loader('svgo-loader').options({
  119. plugins: extendDefaultPlugins([{
  120. name: "removeAttrs",
  121. params: {
  122. attrs: 'fill',
  123. }
  124. }])
  125. });
  126. },
  127. devServer: {
  128. //代理配置
  129. proxy: {
  130. '/cbk': {
  131. target: 'http://192.168.11.109:18701', // 请求地址
  132. changeOrigin: true, // 在vue-cli3中,默认changeOrigin的值是true,意味着服务器host设置成target,这与vue-cli2不一致,vue-cli2这个默认值是false
  133. // changeOrigin的值是true,target是host, request URL是http://baidu.com
  134. // 如果设置changeOrigin: false,host就是浏览器发送过来的host,也就是localhost:8082。
  135. pathRewrite: { // 路径重写,eg:把api接口替换为''
  136. '^/cbk': ''
  137. }
  138. }
  139. },
  140. open: false, // 是否打开浏览器
  141. }
  142. }