vue-cli 项目搭建

1.首先,确保你安装了node和npm,安装后检查是否安装成功,打开cmd终端,输入如图:

vue-cli 项目搭建

2.你可以使用cnpm代替npm提高安装速率,在命令行输入:

 npm install -g cnpm --registry=http://registry.npm.taobao.org  等待安装完成

3.安装vue-cli脚手架构建工具

cnpm install -g vue-cli

或者如下写法也可:

cnpm install -g @vue/cli

或者你要遗留vue-init功能:cnpm install -g @vue/cli-init

4.构建项目

你可以在命令行中转到选定的项目放置目录,在命令行中运行命令:vue init webpack my-project

过程中根据需要选择Y/N

vue-cli 项目搭建

然后enter等待构建完成,成功后会显示如下字段:

vue-cli 项目搭建

进入你的项目:cd my-project

然后尽可以运行项目了:npm run dev

vue-cli 项目搭建

运行成功后会显示端口号,在浏览器中输入端口号即可看到页面。

vue-cli 项目搭建

浏览器打开页面如图:

vue-cli 项目搭建