vue-cli搭建项目详细教程
一、准备工作
安装node.js
进入node.js官网下载node.js,下载完成之后双击安装,完成之后进入cmd命令行(不会打开cmd?widows键 + R键,输入cmd,回车!),输入node -v ,出现版本号就表示安装成功,如图:
安装npm
知道为啥先让你安装node.js不?因为node.js已经集成了npm,所以安装node.js的时候npm也已经安装好了。不信你就在命令行中输入 npm -v 来测试一下,看有没有版本号!
同学别走,我教你安装cnpm(淘宝镜像):命令行输入 npm install -g cnpm --registry=https://registry.npm.taobao.org,安装完成以后,你绝大部分的npm ****命令都可以用cnpm ****代替了,比npm快多了!
二、全局安装vue-cli
打开cmd,输入npm install --global vue-cli(敢这么输打死你!输入 cnpm install --global vue-cli)。
三、利用vue-cli搭建项目
- 想一想你想在哪个磁盘下的那个文件夹中搭建你的项目,想好之后,在你想的那个文件夹下打开cmd命令行。不会?右手按住shift,左手单击右键,然后单击“在此处打开命令窗口”。(对,我有《权力的游戏》资源!)
输入 vue init webpack project(project是你搭建的项目名称,请自由发挥!) - 然后,开始和终端对话吧!
我喜欢一路回车,你也可以自己选择。这几个配置选择yes 或者 no 对于我们项目最大的影响就是,如果选择了yes 则生成的项目会自动有相关的配置,有一些loader我们就要配套下载。所以如果我们确定不用的话最好不要yes,要么下一步要下很多没有用的loader。 - 等待…
- 完成。打开project文件夹,是这样婶儿的over!