node.js + vue + view框架

​​​​​​1.下载node.js：http://nodejs.cn/  安装node一路回车就行了，这里不详细说明

2.安装完后检查node是否安装成功,在控制台上输入$node -v ,如出现banb版本号，便是安装成功

 

 

注：这里可以使用自带的控制台，与其他的软件上面的，都是可通用的

 

3.一般安装node后，npm是不用单独安装的，因为已经在node已经自带了，查看npm版本号代码:npm -v

如：

 

4.安装淘宝镜像

大家都知道国内直接使用 npm 的官方镜像是非常慢的，这里推荐使用淘宝 NPM 镜像。

安装

$ npm install -g nrm

使用

列出可选的源

; nrm ls                                                                                                                                    

* npm ---- https://registry.npmjs.org/
  cnpm --- http://r.cnpmjs.org/
  taobao - http://registry.npm.taobao.org/
  eu ----- http://registry.npmjs.eu/
  au ----- http://registry.npmjs.org.au/
  sl ----- http://npm.strongloop.com/
  nj ----- https://registry.nodejitsu.com/

带 * 的是当前使用的源，上面的输出表明当前源是官方源。

切换

切换到taobao

; nrm use taobao                                                                                                                             

   Registry has been set to: http://registry.npm.taobao.org/

增加源

你可以增加定制的源，特别适用于添加企业内部的私有源。 私有源可以使用cnpmjs架设 。

nrm add  <registry> <url> [home]

删除源

nrm del <registry>

测试速度

你还可以通过 nrm test 测试相应源的响应时间。

例如，测试官方源的响应时间：

; nrm test npm                                                                                                                               

  npm ---- 1328ms

测试所有源的响应时间：

; nrm test                                                                                                                                   

  npm ---- 891ms
  cnpm --- 1213ms
* taobao - 460ms
  eu ----- 3859ms
  au ----- 1073ms
  sl ----- 4150ms
  nj ----- 8008ms

5.安装webpack

npm install webpack -g

安装vue脚手架

npm install vue-cli -g

检查vue脚手架是是否搭建成功：vue -V (在此注意V为大写)

 

6.这些搭建好之后，就准备开始vue了

一般我会使用一个编辑器的终端，这样毕竟方便，编辑与看环境的提示，如：

Visual Studio Code编辑器

按住ctrl+~ 就会调用该编辑器的终端；

如果我想到e盘安装vue，那么：

稍等一会，就会在e盘中会出现一个文件夹，如：

 

安装完后，cd vue_view 进入该文件夹目录，安装依赖

很显然已经安装成功，那么我们运行起来看看吧！

很显然控制台已经告诉我们，在浏览器中输入 http://localhost:8080 就能打开，我们已经安装成功的vue。

7.我们vue安装完成，现在我们来继续安装依赖于vue的第三方ui框架

如：安装 http://element-cn.eleme.io/#/zh-CN 饿了么 ui，但是这个框架组件，没有view组件全面，所以暂时推荐 view：https://www.iviewui.com/docs/guide/install

NPM 安装

推荐使用 npm 来安装，享受生态圈和工具带来的便利，更好地和 webpack 配合使用

$ npm install iview --save

这个安装的目录也是在我刚才安装vue的 e盘vue_view文件夹中安装

安装完成后，再重新安装一遍依赖包，cnpm install

安装完成后：配置一下router文件夹中index.js

配置与上完成后，npm run dev 来运行

当然也是在浏览器上的8080窗口看见效果。

来测试一遍，直接打开view ui 的网页，里面的代码直接往贴

显而易见：

这个view ui的组件我们已经调用成功。。。

这些知识简单的配置，希望能够对您有用

转载于:https://my.oschina.net/u/3010603/blog/1632710