经过vue-cli脚手架建立VUE项目

在没有脚手架以前,咱们都须要一步一步的安装vue的所需的一大堆依赖,和vue的一些模块,你们称这为vue全家桶,包括vue路由等等。每次建都会很烦恼,由于第一个项目和第二个项目之间一般都隔了一段时间,要求从新搭建一个新的vue项目,没有必定的记性,和没有写下笔记的朋友,搭起一个这样的框架真的有点难度。html

 

后来发现了这个vue-cli的脚手架,搭起一个vue的项目就变得简单了,下面就记录一下怎样使用这个脚手架。vue

1. 装一个nodeJSnode

这个步骤必不可少,使用nodeJS,来管理你的模块vue-cli

 

2. 安装一个vue-cli模块npm

在1.x 和 2.x以前,vue-cli就叫vue-clijson

在3.x后,名字更改成 @vue/cli浏览器

这里安装必须是全局框架

npm install -g @vue/cli

 

3. 建立vue项目测试

这里须要注意的是,项目名称不能有大写,不然会建立失败spa

 

vue create 项目名称

 

4. 根据提示,完成建立

1.x 和 2.x 的时候建立会有各类提示,这个能够网上找旧的

3.x后,会分两种,第一种是默认,默认就是帮你预装了路由等等一系列的内容,包括elint语法验证等等,按确认后,直接就等待安装完毕就能够了

 

 

下面看看第二种:

在这种方式里面,能够选择须要安装的模块,点击回车,而后根据项目须要,选择须要的模块,点击回车项目就会建立完毕了

  

 

5. 测试结果

进入项目,的文件夹里面,而后执行命令,而后在浏览器中输入 localhost:8080 若是可以弹出一个vue的欢迎页面,表明成功了

在这里提示一下,在2.x的时候,命令有多个,运行测试是npm run dev,但在3.x后,变得少了,并且dev改为了 server,若是运行不了,能够查看项目下对应的package.json文件

script里面就是run的那些命令脚本

npm run server

 

 

原文出处:https://www.cnblogs.com/oscar1987121/p/10626775.html

相关文章
相关标签/搜索