前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Vue cli ,2与3

Vue cli ,2与3

作者头像
名字是乱打的
发布2021-12-23 17:30:11
5260
发布2021-12-23 17:30:11
举报
文章被收录于专栏:软件工程软件工程
一 CLI是什么意思?
  • CLI是Command-Line Interface,翻译为命令行界面俗称脚手架.
  • Vue CL是一个官方发布vue.js项目脚手架,使用vue-cli可以快速搭建Vue开发环境以及对应的webpack配置.
二 vue cli使用前提
  • node安装(npm顺带着就安装了)
  • webpack安装
    • Vuejs官方脚手架工具就使用了webpack模板口对所有的资源会压缩等优化操作
    • 它在开发过程中提供了一套完整的功能,能够使得我们开发过程中变得高效.
三 安装Vue CLI

npm install -g @vue/cli (-g 我们直接用-g让它全局安装即可) 注意:Vue CLI一月一个小版本,一年一个大版本,我们用上面安装的是比较新的版本,如果需要想按照Vue CLI2的方式初始化项目时不可以的。官网上也有些以前的cli版本安装方式如↓

Vue CLI2初始化项目

vue init webpack my-project

Vue CLI3之后初始化项目

vue create my-project

四 Vue Cli2创建项目

创建项目的步骤以及可选项

创建完项目后,项目的结构

关于我们用脚手架创建工程时候要不要用Runtime-compiler

选择项

Runtime-Compiler和Runtime-only的区别

总结:

  • 如果在之后的开发中,你依然使用template,就需要选择Runtime-Compiler
  • 如果你之后的开发中,使用的是.vue文件开发,那么可以选择Runtime-only
vue-cli 3 与 2 版本有很大区别
  • vue-cli 3 是基于 webpack 4 打造,vue-cli 2 还是 webapck 3
  • vue-cli 3 的设计原则是“0配置”,移除的配置文件根目录下的,build和config等目录
  • vue-cli 3 提供了 vue ui 命令,提供了可视化配置,更加人性化
  • 移除了static文件夹,新增了public文件夹,并且index.html移动到public中

Vue CLI3目录结构

配置去哪里了?

自定义别名

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021/4/22 下,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一 CLI是什么意思?
  • 二 vue cli使用前提
  • 三 安装Vue CLI
  • 四 Vue Cli2创建项目
  • 关于我们用脚手架创建工程时候要不要用Runtime-compiler
  • vue-cli 3 与 2 版本有很大区别
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档