Vue旺财项目搭建知识点

143 阅读1分钟

 默认安装好vue-cli(本文使用4.1.2版),三个比较重要知识点

1.创建项目:

vue create money-1  //money-1是项目名,自己取
cd money-1
yarn serve

其中,vue create 的配置:





完整配置:


------------------------------------------------------------------------------------------------

2.编辑器优化:(vscode)

安装Vetur 和 Vue VSCode Snippets插件

使用:vbase生成vue组件模板代码


生成的代码如下图:(本项目使用typescripts)


然后现在可以看到style的模板还不是我们所需要的,删掉这段,使用scss:



OK,优化完毕。

------------------------------------------------------------------------------------------------

3.在JS/TS里使用@和在CSS/SCSS里使用~@

这个啥意思呢,在JS/TS,CSS/SCSS使用import引入文件的时候每次都要考虑文件路径,非常麻烦,我们可以使用@来代替src路径引入文件,即:

JS/TS:import @/目录名

CSS/SCSS:import ~@/目录名

------------------------------------------------------------------------------------------------

最后补一张项目目录说明: