码迷,mamicode.com
首页 > 其他好文 > 详细

使用脚手架 vue-cli 4.0以上版本创建vue项目

时间:2020-05-23 09:25:12      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:article   搭建   man   是什么   org   资源   detail   老师   bsp   

1. 什么是 Vue CLI

如果你只是简单写几个Vue的Demo程序, 那么你不需要Vue CLI;如果你在开发大型项目, 那么你需要, 并且必然需要使用Vue CLI。

使用Vue.js开发大型应用时,我们需要考虑代码目录结构、项目结构和部署、热加载、代码单元测试等事情。 如果每个项目都要手动完成这些工作,效率比较低效,所以通常我们会使用一些脚手架工具来帮助完成这些事情。

CLI是什么意思? CLI是 Command-Line Interface, 翻译为命令行界面, 但是俗称脚手架. Vue CLI是一个官方发布 vue.js 项目脚手架 使用 vue-cli 可以快速搭建Vue开发环境以及对应的webpack配置。

2. Vue CLI 使用前提 

(1)Node

有关Node的安装及检测请参考 https://blog.csdn.net/Soinice/article/details/87793793?ops_request_misc=%7B%22request%5Fid%22%3A%22158203429919725211909892%22%2C%22scm%22%3A%2220140713.130056874..%22%7D&request_id=158203429919725211909892&biz_id=0&utm_source=distribute.pc_search_result.none-task 

(2)Webpack

Vue.js官方脚手架工具就使用了webpack模板,它对所有的资源会压缩等优化操作,它在开发过程中提供了一套完整的功能,能够使得我们开发过程中变得高效。

Webpack的全局安装:

npm install webpack -g

3. Vue CLI 的使用

3.1 安装Vue脚手架

npm install -g @vue/cli

可以通过cmd查看安装版本

vue --version

3.2 创建项目

vue create my-project

下面是Vue CLI2 和 Vue CLI3(3和4差别不大)的对比,这里借用 coderwhy 老师的两幅图来说明:

技术图片 技术图片

 

 有关 Vue CLI 更多介绍请看官网 https://cli.vuejs.org/zh/guide/

使用脚手架 vue-cli 4.0以上版本创建vue项目

标签:article   搭建   man   是什么   org   资源   detail   老师   bsp   

原文地址:https://www.cnblogs.com/BAHG/p/12940939.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!