一项技能久了不用就会变得生疏,在之前做项目的过程中,一开始还能熟练的搭建vuecli,结果到这次需要再次使用的时候,发现已经忘得差不多了;其实也就无外乎那几步,只是搭建用少了,也就容易遗忘,下面是我根据自己的使用习惯,整理出来的关于VueCli的搭建过程。
-
首先的前提是我们已经安装好了npm包管理工具;因为我们需要通过它来下载vue需要用到的东西;
-
我们通过新建一个文件夹,在对应的编辑器里面打开该文件夹,然后打开控制台,在控制台我们可以使用下列任一命令安装这个新的包:cnpm install -g @vue/cli 或者 yarn global add @vue/cli,安装之后,可以在命令行中通过vue –version查看是否安装成功,例如3.x;
-
因为我们的vue serve 的缺点就是它需要安装全局依赖,下面需要安装一个全局的扩展,通过命令行输入:cnpm install -g @vue/cli-service-global;
-
接下来我们可以通过vue create命令实现新项目的创建。执行命令vue create my-project (my-project 表示项目名);
-
选取默认preset,你可以选默认的包含了基本的 Babel + ESLint 设置的 preset,也可以选“手动选择特性”来选取需要的特性。(preset为预设置的意思,vue预先设置了几种模板供我们选择),这里我们先选择默认的包含了基本的Babel + ESLint 设置的 preset。
-
安装完成后我们可以在终端打开我们的项目,然后执行npm run serve将代码运行起来;
-
执行npm run build实现生产环境的编译和压缩,会生成一个dist文件夹,然后将它放在服务端就能跑起来了;
-
关于使用的详情呢,也可以通过官网的中文文档进行操作:https://cli.vuejs.org/zh/guide/;