首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Vue cli 3项目别名src为@或~/不起作用

Vue CLI 3是一个基于Vue.js开发的项目脚手架工具,用于快速搭建Vue.js项目。它内置了许多开发工具和配置,以简化项目的开发和部署流程。

在Vue CLI 3中,项目别名的配置默认是通过vue.config.js文件进行设置。通过该文件,可以自定义项目的各种配置,包括别名配置。

要解决"src"别名不起作用的问题,可以按照以下步骤进行:

  1. 在项目根目录下创建vue.config.js文件(如果已存在,则打开该文件)。
  2. 在vue.config.js文件中,添加以下代码:
代码语言:txt
复制
const path = require('path');

module.exports = {
  chainWebpack: config => {
    config.resolve.alias.set('@', path.resolve(__dirname, 'src'));
    config.resolve.alias.set('~', path.resolve(__dirname, 'src'));
  }
};
  1. 保存文件并重新启动项目。

以上代码通过使用webpack的resolve.alias配置,将"@"和"~"两个别名分别映射为"src"目录的绝对路径。这样,在项目中可以使用"@/xxx"或"~/xxx"来引用src目录下的文件或模块。

Vue CLI 3的优势包括:

  • 快速搭建Vue.js项目:提供了项目脚手架和可视化配置界面,简化了项目的初始化过程。
  • 简化的配置:内置了常用的开发工具和配置,减少了开发人员的配置工作。
  • 灵活的插件系统:支持通过插件来扩展项目的功能和配置。
  • 丰富的生态系统:Vue CLI 3与Vue.js生态系统紧密集成,可以无缝使用Vue.js相关的库和工具。

Vue CLI 3的应用场景包括:

  • Web应用开发:Vue CLI 3适用于各种规模的Web应用开发,从小型应用到大型企业级项目都可以使用。
  • 前端工程化实践:通过Vue CLI 3,可以快速搭建标准化的前端工程项目,提高开发效率和代码质量。
  • 个人项目和学习:Vue CLI 3提供了简单易用的开发工具和配置,适合个人项目和学习Vue.js的初学者使用。

在腾讯云的产品中,与Vue CLI 3相关的产品包括:

  • 云托管(云开发助手):腾讯云提供的云托管服务,可用于将Vue CLI 3项目部署到云上,实现自动化部署和扩展能力。详细介绍请参考云托管产品介绍
  • 云函数(云开发助手):腾讯云提供的云函数服务,可用于在Vue CLI 3项目中编写和运行云函数,实现前后端分离和业务逻辑的扩展。详细介绍请参考云函数产品介绍

通过使用腾讯云的云托管和云函数服务,可以方便地将Vue CLI 3项目部署到云上,并实现自动化部署、高可用性和弹性扩展等能力。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

33分26秒

Vue3.x全家桶 4_vue-cli脚手架安装与项目创建 学习猿地

10分6秒

Vue3.x项目全程实录 4_初使化项目设置目录别名 学习猿地

15分9秒

002-尚硅谷-尚品汇-vue-cli脚手架初始化项目

领券