参考:
前言
一、Vue-cli介绍
简单地说就是构建vue项目的工具包,通过vue-cli会自动构建vue项目的结构。
二、开始
2.0 下载安装npm 以及git
npm安装
npm(Nodejs软件包管理工具)
下载后双击安装即可
git安装
安装git后 右键鼠标会发现git bash
后面的npm 可以在gitbash中输入命令行
2.1 全局安装 vue-cli
安装vue-cli(vue2)
npm install --global vue-cli • 1
安装vue-cli(vue3)
npm install -g @vue/cli • 1
2.2 创建项目
创建名为test的项目
vue init webpack test • 1
注意:没说明的直接回车选择默认就好
“Project name”
:这个是项目名称,默认是输入时的那个名称,想改的话直接输入修改,也可以直接回车
“Install vue-router”
:是否需要vue-router,这里默认选择使用,这样生成好的项目就会有相关的路由配置文件
“Use ESLint to lint your code”
:是否使用ESLint,刚才说了我们这个项目需要使用所以也是直接回车,默认使用,这样会生成相关的ESLint配置
“Setup unit tests with Karma + Moch?”
: 是否安装单元测试。由于我们现在还没有单元测试,所以这里选择的是”N”,而不是直接回车哦
“Setup e2e tests with Nightwatch”
:是否安装e2e测试,这里我也同样选择的是“N” 这几个配置选择yes 或者 no 对于我们项目最大的影响就是,如果选择了yes 则生成的项目会自动有相关的配置,有一些loader我们就要配套下载。
所以如果我们确定不用的话最好不要yes,要么下一步要下很多没有用的loader
目录介绍
创建完后 用hbuilder打开就是如下图的目录结构:
三、常见问题
Error: Cannot find module ‘@dcloudio/uni-cli-i18n’
总结
简单地介绍vue-cli项目的构建,以便使用hbuilder。