使用vue-cli创建项目的步骤

简介: 一.什么是vue-cli(1)vue-cli 是 Vue.js 开发的标准工具。它简化了程序员基于 webpack 创建工程化的 Vue 项目的过程(2)引用自 vue-cli 官网上的一句话:程序员可以专注在撰写应用上,而不必花好几天去纠结 webpack 配置的问题。中文官网:https://cli.vuejs.org/zh/二.安装vue-cli(1)vue-cli 是 npm 上的一个全局包,使用 npm install 命令,即可方便的把它安装到自己的电脑上:随意打开一个cmd窗口,输入:npm install -g @vue/cli(2)输入vue -V即可验证是

使用vue-cli创建项目的步骤



一.什么是vue-cli


(1)vue-cli 是 Vue.js 开发的标准工具。它简化了程序员基于 webpack 创建工程化的 Vue 项目的过程


(2)引用自 vue-cli 官网上的一句话:

程序员可以专注在撰写应用上,而不必花好几天去纠结 webpack 配置的问题。

中文官网:https://cli.vuejs.org/zh/


二.安装vue-cli


(1)vue-cli 是 npm 上的一个全局包,使用 npm install 命令,即可方便的把它安装到自己的电脑上:

随意打开一个cmd窗口,输入:npm install -g @vue/cli


(2)输入vue -V即可验证是否成功


d68f109245584fc1b365c032b2edb9ed.png


三.使用vue-cli创建项目


(1)找到需要创建的项目的目录


a4956937d48e4545b01f8ab32cb98285.png


(2)在方框中输入cmd


53f71eb85d2e4741854d634cd7fb9b65.png


2.输入你要创建的项目名


格式:vue create 项目名


7aa46fa510d842c685216701f53b85fb.png


2221a56cd4134c3786c11fbc85311e5e.png


3.选择最下面那一项


4.按空格键可取消选项,选择这两个


8ac44aa021f046eaa02284026a58c5ab.png


5.根据需要选择vue的版本号


9da2ab147ca548259eb32cf2aa259e79.png


6.选择Less这一项


4a3e2d7da16343e090128708b3450259.png


7.


cbc066ff8c66405fa8ff49fa9e106490.png

相关文章
|
9月前
|
JavaScript 前端开发 开发者
Vue-cli搭建SPA项目1
Vue-cli搭建SPA项目1
39 0
|
7月前
|
JavaScript 前端开发 测试技术
通过Vue-cli搭建spa项目
通过Vue-cli搭建spa项目
|
1月前
|
资源调度 JavaScript 前端开发
【vue】vue-cli版本选择和比较(vue-cli3.0新版本如何创建项目)
【vue】vue-cli版本选择和比较(vue-cli3.0新版本如何创建项目)
32 1
|
9月前
|
JavaScript 前端开发
Vue-cli搭建SPA项目2
Vue-cli搭建SPA项目2
40 0
|
8月前
|
资源调度 JavaScript 前端开发
Vue的详细教程--用Vue-cli搭建SPA项目
Vue的详细教程--用Vue-cli搭建SPA项目
38 0
|
1月前
|
JavaScript
使用 Vue CLI 创建 Vue 项目的详细步骤
使用 Vue CLI 创建 Vue 项目的详细步骤
16 0
|
10月前
|
JavaScript 数据可视化
[Vue]vue cli (脚手架)(项目的创建与分析)(二)
[Vue]vue cli (脚手架)(项目的创建与分析)(二)
|
6月前
|
资源调度 JavaScript 前端开发
vue-cli安装与搭建SPA项目
vue-cli安装与搭建SPA项目
52 0
|
7月前
|
JavaScript 前端开发 数据安全/隐私保护
一篇让你使用vue-cli搭建SPA项目
一篇让你使用vue-cli搭建SPA项目
112 0
|
9月前
|
JavaScript 数据可视化 开发工具
vue2项目 vue-cli脚手架的可视化创建以及命令行参数创建
vue2项目 vue-cli脚手架的可视化创建以及命令行参数创建
49 0

热门文章

最新文章

相关实验场景

更多