vue3.0 CLI - 1 - npm 安装与初始化的入门教程


Posted in Javascript onSeptember 14, 2018

node 开发环境请先自行准备

npm install -g @vue/cli 安装完成之后命令行则存在 vue 命令

vue -V 查看本地 vue 版本 vue -h 输出帮助

vue create <project-name> 进入工程文件夹,创建项目。

如:cd studyVue ( 进入工程文件夹 ) vue create config ( 创建 config 项目 )

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

选择 default 配置项,下面没什么可介绍的,自行尝试。

下面介绍选择 manually select features 的相关流程 ( 使用上下箭头按键切换选项 - enter 按键确定选择 - 下同 )

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择项目需要的特性 ( 让你选择项目里边的插件 )

Babel - 转码工具;TypeScript - 微软出的 js 的超集;PWA -渐进式WEB应用;Router - 路由功能;Vuex - 中心化状态管理;CSS - css处理器;Linter - 代码美化与检查; Unit Testing - 单元测试; E2E Testing -端到端测试。

作为一个有志气的人,咱们全都选,以后慢慢学。( 空格键按键选择 - 下同 )

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

按下 enter 确定之后,能看到上一个配置项我们选择了什么。

该配置项:是否使用 class-style 组件语法,选择 yes 。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置选择 yes 。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:是否使用 history 模式 ( 该模式含义以后我会介绍 - 官网也有介绍 ),选择 no 。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择 css 预处理 ( 我没用过 css 预处理器 ),任意选择了一个。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择代码美化和检查配置。这里选择标准配置 ( 我也没用过,先选一个 )。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择代码检查美化的相关配置。两项都选。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择单元测试解决方案。选择 mocha ( 我也没用过,选择一个用的人多的 )。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择端到端测试解决方案。选择nightwatch( 我也不懂,读者自行选择 )。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:选择在哪里存放上述的所有的配置。以前都是放在 package.json 中 ( webpack 使用习惯 ),另外一个是 vue 3.0 新的存配置的方式,使得配置项更加简洁。选择In dedicated config files 。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

该配置项:将以上所有的配置过程,保存为默认的配置流程。( 也就是个人设置的意思,以后新建项目,默认采用这些配置 )。选择 yes 。

后面让你为这个配置项进行命名。我输入 nDosVue 。

之后就开始自动化的工程配置。1 min 之内就配置好。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

npm run serve 开启网站;cd config 进入配置文件夹。到此,vue 创建第一个项目完成。

vue3.0 CLI - 1 - npm 安装与初始化的入门教程

最后生成的目录如上图。

总结

以上所述是小编给大家介绍的vue3.0 CLI - 1 - npm 安装与初始化的入门教程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
使用Jquery Aajx访问WCF服务(GET、POST、PUT、DELETE)
Mar 16 Javascript
JS写的贪吃蛇游戏(个人练习)
Jul 08 Javascript
jquery删除指定的html标签并保留标签内文本内容的方法
Apr 02 Javascript
jquery获取html元素的绝对位置和相对位置的方法
Jun 20 Javascript
jQuery中大家不太了解的几个方法
Mar 04 Javascript
javascript实现很浪漫的气泡冒出特效
Sep 05 Javascript
微信小程序左右滑动切换页面详解及实例代码
Feb 28 Javascript
Angular2开发——组件规划篇
Mar 28 Javascript
详解webpack和webpack-simple中如何引入css文件
Jun 28 Javascript
vue中获取滚动table的可视页面宽度调整表头与列对齐(每列宽度不都相同)
Aug 17 Javascript
JavaScript中的this基本问题实例小结
Mar 09 Javascript
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
详解Vue CLI3配置解析之css.extract
Sep 14 #Javascript
vue-cli脚手架build目录下utils.js工具配置文件详解
Sep 14 #Javascript
vue3.0 CLI - 2.6 - 组件的复用入门教程
Sep 14 #Javascript
在vue项目中使用md5加密的方法
Sep 14 #Javascript
在vue项目中引用Iview的方法
Sep 14 #Javascript
详解webpack-dev-server使用方法
Sep 14 #Javascript
JS 实现微信扫一扫功能
Sep 14 #Javascript
You might like
怎样在PHP中通过ADO调用Asscess数据库和COM程序
2006/10/09 PHP
php中jQuery插件autocomplate的简单使用笔记
2012/06/14 PHP
mac环境中使用brew安装php5.5.15
2014/08/18 PHP
PHP 正则表达式小结
2015/02/12 PHP
php获取从百度、谷歌等搜索引擎进入网站关键词的方法
2015/07/08 PHP
Laravel使用memcached缓存对文章增删改查进行优化的方法
2016/10/08 PHP
用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中
2007/04/20 Javascript
javascript+dom树型菜单类,希望朋友们一起进步
2007/05/03 Javascript
javascript之对系统的toFixed()方法的修正
2007/05/08 Javascript
js 自定义的联动下拉框
2010/02/07 Javascript
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
2013/06/09 Javascript
Sea.JS知识总结
2016/05/05 Javascript
echarts3 使用总结(绘制各种图表,地图)
2017/01/05 Javascript
js常用DOM方法详解
2017/02/04 Javascript
Bootstrap栅格系统简单实现代码
2017/03/06 Javascript
ES6新特性四:变量的解构赋值实例
2017/04/21 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(二)
2017/05/11 Javascript
Thinkjs3新手入门之如何使用静态资源目录
2017/12/06 Javascript
js编写简易的计算器
2020/07/29 Javascript
Python使用matplotlib绘制动画的方法
2015/05/20 Python
python实现BackPropagation算法
2017/12/14 Python
使用Python搭建虚拟环境的配置方法
2018/02/28 Python
Python画图高斯分布的示例
2019/07/10 Python
django和vue实现数据交互的方法
2019/08/21 Python
Python文件路径名的操作方法
2019/10/30 Python
Windows 下python3.8环境安装教程图文详解
2020/03/11 Python
德国baby-markt婴儿用品瑞士网站:baby-markt.ch
2017/06/09 全球购物
承诺书怎么写
2014/03/26 职场文书
体育节口号
2014/06/19 职场文书
关键在于落实心得体会
2014/09/03 职场文书
乡镇党的群众路线教育实践活动总结报告
2014/10/30 职场文书
地心历险记观后感
2015/06/15 职场文书
python文件目录操作之os模块
2021/05/08 Python
Python实现生活常识解答机器人
2021/06/28 Python
SQL Server 忘记密码以及重新添加新账号
2022/04/26 SQL Server
CSS 实现磨砂玻璃(毛玻璃)效果样式
2023/05/21 HTML / CSS