const path = require('path'); const resolve = (dir) => path.join(__dirname, dir); const CopyWebpackPlugin = require('copy-webpack-plugin'); const webpack = require('webpack'); function extendDefaultPlugins(arr) { let plug = [ 'removeDoctype', 'removeXMLProcInst', 'removeComments', 'removeMetadata', 'removeEditorsNSData', 'cleanupAttrs', 'mergeStyles', 'inlineStyles', 'minifyStyles', 'cleanupIDs', 'removeUselessDefs', 'cleanupNumericValues', 'convertColors', 'removeUnknownsAndDefaults', 'removeNonInheritableGroupAttrs', 'removeUselessStrokeAndFill', 'removeViewBox', 'cleanupEnableBackground', 'removeHiddenElems', 'removeEmptyText', 'convertShapeToPath', 'convertEllipseToCircle', 'moveElemsAttrsToGroup', 'moveGroupAttrsToElems', 'collapseGroups', 'convertPathData', 'convertTransform', 'removeEmptyAttrs', 'removeEmptyContainers', 'mergePaths', 'removeUnusedNS', 'sortDefsChildren', 'removeTitle', 'removeDesc' ]; return plug.concat(arr); } // 添加less继承 function addStyleResource(rule) { rule.use('style-resource') .loader('style-resources-loader') .options({ patterns: [ resolve('src/assets/styles/common/common.less') ] }) } module.exports = { publicPath: "./", // 默认'/',部署应用包时的基本 URL indexPath: 'index.html', // 相对于打包路径index.html的路径 outputDir: 'dist', // 'dist', 生产环境构建文件的目录 assetsDir: 'static', // 相对于outputDir的静态资源(js、css、img、fonts)目录 lintOnSave: false, // 是否在开发环境下通过 eslint-loader 在每次保存时 li runtimeCompiler: true, // 是否使用包含运行时编译器的 Vue 构建版本 configureWebpack: { plugins: [ ], module:{ rules: [ { test: /\.js$/, use: { loader: '@open-wc/webpack-import-meta-loader', }, }, ] } }, chainWebpack: (config) => { config.resolve.symlinks(true); // 修复热更新失效 config.plugin('html') .tap(args => { args[0].title = "智慧光伏集维管理系统"; return args; }) // 路径别名 config.resolve.alias .set("@", resolve("src")) .set("@node", resolve("node_modules")) .set("@com", resolve("src/components")) .set("@assets", resolve("src/assets")) .set("@api", resolve("src/api")) .set("@store", resolve("src/store")) .set("@modeConfig", resolve("public/static/config")) .set("@tools", resolve("src/tools")) .set("cesium", resolve("node_modules/cesium/Source")); // less 继承 const types = ['vue-modules', 'vue', 'normal-modules', 'normal']; types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type))); const metaLoaderRule = config.module.rule('meta-loader'); metaLoaderRule.test(/\.js$/) .use('@open-wc/webpack-import-meta-loader') .loader('@open-wc/webpack-import-meta-loader'); // svg 雪碧图 config.module // 排除其他svg-loader .rule('svg') .exclude.add(resolve('src/assets/icon/svg')) .end() .exclude.add(resolve('src/assets/icon/svg_fill')) .end(); // svg雪碧图 const svgRule = config.module.rule('icons'); svgRule.test(/\.svg$/) .include.add(resolve('src/assets/icon/svg')) .end() .use('svg-sprite-loader') .loader('svg-sprite-loader') .options({ symbolId: 'svg-[name]' }); // svgo 去除svg中无用元素 svgRule.use('svgo-loader').loader('svgo-loader').options({ plugins: extendDefaultPlugins([{ name: "removeAttrs", params: { attrs: 'fill', } }]) }); }, devServer: { //代理配置 proxy: { '/cbk': { target: 'http://192.168.11.109:18701', // 请求地址 changeOrigin: true, // 在vue-cli3中,默认changeOrigin的值是true,意味着服务器host设置成target,这与vue-cli2不一致,vue-cli2这个默认值是false // changeOrigin的值是true,target是host, request URL是http://baidu.com // 如果设置changeOrigin: false,host就是浏览器发送过来的host,也就是localhost:8082。 pathRewrite: { // 路径重写,eg:把api接口替换为'' '^/cbk': '' } } }, open: false, // 是否打开浏览器 } }