当前位置: 首页 > Web前端 > HTML

[vue-cli3.0]vue.config.js配置-路径别名

时间:2023-04-02 21:30:43 HTML

vue-cli3如何配置vue.config.js的路径别名?前段时间更新电脑,重装了vue-cli,发现vue-cli已经更新到3.0版本了。用它搭建项目后,发现简化了很多,配置文件现在可以统一在vue.config.js中了。是不是很方便?从此,公司的所有项目都使用了一个配置文件,妈妈再也不用担心我每次都新建一个了。投影时重新配置了各种复杂的选项。那么如何在vue.config.js中配置路径别名呢?1.创建项目2.在根目录新建vue.config.js3.修改vue.config.js//vue.config.jsmodule.exports={configureWebpack:{resolve:{alias:{'assets':'@/assets','components':'@/components','views':'@/views',}}},}之所以用'@/assets'是因为偷懒使用/node_modulesin3.x@path已经在/@vue/cli-service/lib/config/base.js中配置好了,有兴趣的可以进文件看看...webpackConfig.resolve.set('符号链接',false).extensions.merge(['.js','.jsx','.vue','.json']).end().modules.add('node_modules').add(api.resolve('node_modules')).add(resolveLocal('node_modules')).end().alias.set('@',api.resolve('src')).set('vue$',options.runtimeCompiler?'vue/dist/vue.esm.js':'vue/dist/vue.runtime.esm.js')···参考文档:vue-cli3webpack相关简单配置方法webpackresolve.alias