Vue快速入门01
一、安装Vue工具(Vue cli)
Vue cli基于 Vue.js 进行快速开发的完整系统。
人话:脚手架,顾名思义就是搭建工程的一个工具,脚手架有很多,vue-cli是其中一种。用来帮助快速搭建vue的开发环境。我们可以想象自己不是在搭建开发环境,而是在做ppt。做ppt之前从头开始设定动画交互、字体大小排班等东西太烦了,因此我们可以选一个现成的模板,直接在模板上修改。
npm是node.js包管理器,它会读取文件夹内部的package.json文件,检查当前的项目需要哪些node.js包来构成然后进行安装。
vue是一个前端框架包,是项目代码的构成部分。它不包含开发工具的作用。跟你使用的vue init xxx命令没有任何关系;
真正包含vue脚手架(也就是帮助你快速搭建vue开发环境的工具)功能的安装包是vue-cli,你只有在全局安装vue-cli(npm install -g vue-cli),你才能使用vue init命令,安装vue是无法使用vue命令的,vue-cli也不会参与你的代码组成。
webpack是什么?
cnpm install -g @vue/cli
cnpm是淘宝镜像。原本是npm。 -g是全局。全局的指什么全局?
安装之后,你就可以在命令行访问vue命令。你可以通过简单运行vue,看看是否展示出了一份所有可用命令的帮助信息,来验证它是否安装成功
vue --version@vue/cli 5.0.8
二、创建一个项目
vue create vue-demo
清理控制台dos命令。cls
注:项目名不能大写。用- 分割。
vue init 和vue create 区别?
上面截图选第三个
选择1和3。不选linter/formatter。它是严格检查代码,可能有空格会提示,比较麻烦。代码规范化。
版本选vue3.x
默认文件夹
选N
三、启动项目
npm run serve
!
启动!
安装高亮插件 Volar
ok,至此,vue的项目已经创建好了!!!
所以来总结一下步骤: ①安装脚手架vue-cli。没有它就不能创建vue工程
②vue create 项目名。按步骤选择选项
③启动项目 ,npm run serve
④访问项目地址:localhost:8080
完结撒花
标签:npm,01,cli,vue,项目,Vue,安装,入门 From: https://www.cnblogs.com/liveforwhat/p/17178975.html