## 使用@符 代替文件引入路径 在vue.config.js中 ~~~ // eslint-disable-next-line @typescript-eslint/no-var-requires const path = require('path') module.exports = { // 1.配置方式一: CLI提供的属性 outputDir: './build', publicPath: '/', // 2.配置方式二: 和webpack属性完全一致, 最后会进行合并 /*configureWebpack: { resolve: { alias: { components: '@/components' } } },*/ // configureWebpack: (config) => { // config.resolve.alias = { // '@': path.resolve(__dirname, 'src'), // components: '@/components' // } // } // 3.配置方式三: chainWebpack: (config) => { config.resolve.alias.set('@', path.resolve(__dirname, 'src')).set('components', '@/components') }, lintOnSave: false, devServer: { overlay: { warning: false, errors: false } }, } ~~~ ### vue2 ~~~ `use script` const path = require("path"); function resolve (dir) { return path.join(__dirname, dir); } module.exports = { resolve: { alias: { "@": resolve("src"), }, }, }; ~~~