const path = require("path"); function resolve(dir) { return path.join(__dirname, dir); } module.exports = { publicPath: './', // 基本路径 outputDir: 'dist', // 构建时的输出目录 assetsDir: 'static', // 放置静态资源的目录 indexPath: 'index.html', // html 的输出路径 filenameHashing: true, // 文件名哈希值 lintOnSave: false, // 是否在保存的时候使用 `eslint-loader` 进行检查。 // 组件是如何被渲染到页面中的? (ast:抽象语法树;vDom:虚拟DOM) // template ---> ast ---> render ---> vDom ---> 真实的Dom ---> 页面 // runtime-only:将template在打包的时候,就已经编译为render函数 // runtime-compiler:在运行的时候才去编译template runtimeCompiler: false, transpileDependencies: [], // babel-loader 默认会跳过 node_modules 依赖。 productionSourceMap: false, // 是否为生产环境构建生成 source map //调整内部的 webpack 配置 configureWebpack: () => { }, devServer: { proxy: { '/socket.io':{ target: 'http://192.168.1.6:1234', // target host changeOrigin: true, // needed for virtual hosted sites logLevel: 'debug' }, '/sockjs-node': { target: 'http://192.168.1.6:1234', ws: false, changeOrigin: true } } }, chainWebpack: config => { config.resolve.alias .set("@", resolve("src")) .set("assets", resolve("src/assets")) .set("components", resolve("src/components")) .set("public", resolve("public")); // set svg-sprite-loader config.module .rule('svg') .exclude.add(resolve('src/assets')) // 存放 svg 目录的目录 .end() config.module .rule('assets') .test(/\.svg$/) .include.add(resolve('src/assets')) // 存放 svg 目录的目录 .end() .use('svg-sprite-loader') .loader('svg-sprite-loader') .options({ symbolId: 'icon-[name]' }) .end() } }