您的位置:首页 > Web前端 > Vue.js

如何用vue-cli快速搭建一个vue项目

2019-05-22 21:18 716 查看
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/Ferbc/article/details/90249954

如何用vue-cli快速搭建一个vue项目
vue-cli是vue的脚手架。脚手架就是工地上为了保证各施工过程顺利进行而搭设的工作平台,vue-cli用来快速搭建一个vue项目。

1.下载Node.js

node.js是一个环境。下载这个环境后我们就可以npm包管理器,去下载很多别人写好的包。http://nodejs.cn/

2.创建一个文件夹,使用vs code打开该文件夹

我在桌面创建一个vuetest文件夹,然后用vs code打开该文件夹

3.安装vue-cli。

ctrl 加 ~键打开终端,输入npm -v 查看node.js是否安装成功,如下图:
输入npm install -g vue-cli,全局安装vue-cli,如下图:

待安装完成后,可以输入vue -V(注意这个V是大写),查看是否安装成功,如下图:

4.创建vue项目

1.vue init webpack project(你的项目名称)

2.之后vue会配置一些文件,可以一路回车确认。在出现ESlint(这是检查语法规则的,才开始学习vue项目时可以关闭)。

5.cd 进入你的项目名称的文件夹,运行项目

在项目初始化好后
输入cd test
然后输入npm run dev,如下图

6.成功生成项目

成功生成项目就可以打开浏览器,输入http://localhost:8080

就会出现vue的欢迎界面,如下图:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: