Vue3-路径别名alias配置
vue3 alias配置
·
在项目中频繁的使用components/XXX.vue太影响效率了,vscode的插件也没有解决这个问题,其实可以使用别名配置来减少编码数量。
- 在项目根目录新建文件,重命名为vite.config.js
3. 配置如下,这个配置是按照官方文档改写的
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from "path";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
//这里猜测应该是一个map,key为别名,value为你要别名的路径
"@": path.resolve(__dirname, "src"),
"coms": path.resolve(__dirname, "src/components"),
},
},
//服务器的端口监听端口配置和host设置
server: {
host: "localhost",
port: 3000,
https: true
},
})
- 在模板中使用
<script>
import Home from "coms/Home.vue";
export default defineComponent({
components: { Home },
setup() {
return {
Home,
};
},
});
</script>
今天的分享到此为止,如有不正确的地方请各位大佬及时指出。
更多推荐
已为社区贡献5条内容
所有评论(0)