昨天打算安装一个vue框架,就在网上找了一些方法,虽然也成功安装了,但是由于各种安装文件,导致安装了一些不必要的东西,今天上午又重新安装了几遍,终于弄清楚安装vue.js的主要流程了。以及其中我遇到的一些问题。
安装
1、 安装nodejs
从node.js(http://nodejs.cn/download/)官网下载并安装node,点击下载安装即可。
node-v命令,查看node的版本,若出现相应的版本号,则说明你安装成功了。
由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了。同样可以通过输入“npm-v”来测试是否成功安装。命令如下,出现版本提示表示安装成功:
2、安装淘宝镜像
打开命令行(win+R)输
npm install -g cnpm --registry= https://registry.npm.taobao.org
3、安装webpack
cnpm install webpack -g
安装成功后如下图:
4、全局安装 vue-cli
cnpm install --global vue-cli
创建一个基于 webpack 模板的新项目
vue init webpack my-project
安装的时候,一直回车即可;
显示安装成功!安装成功后会在默认文件夹里生成文件夹"my-project",
我的安装路径默认是
C:\Users\Administrator\
5、进入项目,安装并运行
按照以下步骤即可完成项目初始化!
cd my-project
cnpm install
cnpm run dev
复制链接,在浏览器里预览。
初始化问题
vue初始化项目时,
vue init webpack my-project
我出现了初始化时报的错"Downloading
https://chromedriver.storage.googleapis.com/2.27/chromedriver_mac64.zip
",由于我的当时没有截图,就在网上找一张图片。
网络好的,会自己重新下载安装,我在家里安装,半天不下载;在公司,一会就下载完了。
若是长时间没有继续下一步,可以使用淘宝镜像。
npm install chromedriver --chromedriver_cdnurl=rl=http://cdn.npm.taobao.org/dist/chromedriver
vue 再次初始化时,下载成功。
由于安装期间遇到了各种安装失败的问题,主要是我安装了以下一些东西。后来发现,这些不需要安装,下载安装完node.js,直接安装淘宝npm即可。
cnpm install npm -g #升级
npmnpm install cnpm -g # 升级或安装cnpm
cnpm install vue # 最新稳定版
npm install npm -g
npm install express # 本地安装
npm install express -g # 全局安装
npm init #创建模块
大家有空也可以自己去试试。PS:安装以上功能时,务必在网络好的地方。否则会很慢很慢。