第一个vue-cli程序



(1)什么是vue-cli




(2)安装node.js


  • 问:Node.js是什么?

  • 答:是一种javascript的运行环境,能够使得javascript脱离浏览器运行。是一种通过JavaScript语言开发web服务端的东西

  • 参考链接:https://www.zhihu.com/question/33578075

  • Node.js下载链接:http://nodejs.cn/download/ 无脑下一步即可

  • 确认是否安装成功(最好用管理员模式打开)


(3)安装npm 和 cnpm 和 vue-cli



  • npm,全称是 Node Package Manager,是一个软件包管理工具

  • 一些解释:


  • 安装npm:npm是Nodejs平台的默认包管理工具,由于新版的NodeJS已经集成了npm,所以npm会随同NodeJS一起安装。

  • 安装cnpm :【虽然安装了cnpm,但是尽量少用】

  • 安装vue-cli

cnpm install --global vue-cli

  • vue list 查看可以基于哪些模板创建vue,通常选择webpack



(4)创建一个vue-cli程序


  • 先进入想要创建项目的目录 【如果下载的vue-cli是最新版,需要使用vue create方式代替vue init webpack,vue run dev换成vue run serve】

  • 创建一个名字为myfirstvue的项目vue init webpack myfirstvue,接着一路回车并且选择no最后创建成功

  • 先进入这个项目目录 cd myfirstvue

  • 下载最开发环境,npm install 或者cnpm install

  • 用idea打开该项目后,执行npm run dev命令,得到如下界面:

  • 进入http://localhost:8080/

则项目搭建成功,ctrl+c在命令提示界面停止该项目





vue