安装前端基础环境-常用命令语句

1.网址：http://nodejs.cn；很据电脑版本下载对应node，安装

2.下载好node之后，打开docs管理工具，先看看node安装成功了没有，输入 node -v ，会输出node的版本号

3.安装cnpm命令

　　　　在国内使用npm是非常慢，淘宝的cnpm命令管理工具可以代替默认的npm管理工具

　　　　npm install -g cnpm --registry=https://registry.npm.taobao.org　　　　

　　　　1. npm 下载依赖包

　　　　　　npm install(可以简写成 i）包的名称 @xxx(@xxx是包的版本)

　　　　2.npm 卸载包

　　　　　　npm uninstall 包名称 

　　　　3. npm 更新包

　　　　　　npm update 包名称

4.修改npm模块安装路径

　　　　1.修改命令　

　　　　　　在node.js的安装目录（C:Program Files odejs）下新建两个文件夹node_cache和node_global方便集中管理。　

　　　　　　因为默认会将模块安装到【C:Users用户名AppDataRoaming pm】路径中，占C盘空间

　　　　　　npm config set prefix "c:Program Files odejs ode_global"
　　　　　　npm config set cache "c:Program Files odejs ode_cache"
　　　　　　之后用npm install XXX -g安装的模块就在这两个文件夹里。

　　　　2.配置环境

　　　　　　在系统变path中新增一个变量C:Program Files odejs ode_global ode_modules

　　　　　　然后在用户变量中修改变量为C:Program Files odejs ode_global

5.安装webpack打包工具（js应用程序的静态模块打包器(module bundler)

　　　　1.安装

　　　　　　npm install webpack  webpack-cli(现在的webpack是和webpack-cli共同使用的）

　　　　　　npm install webpack –g

　　　　2.webpack的模式切换

　　　　　　webpack --mode development　　开发环境下的　　文件打包不压缩

　　　　　　webpack --mode production　　生产环境下的　　将文件压缩

6.安装vue-cli

　　　　安装vue  npm i vue -g　　　

　　　　vue-cli这个构建工具大大降低了webpack的使用难度，支持热更新，有webpack-dev-server的支持，相当于启动了一个请求服务器。
　　　　vue-cli是脚手架，就是用配置好的模版快速搭起一个项目来，省去配置webpack的基本内容。
　　　　安装vue-cli命令：npm install vue-cli –g

7.新建vue项目

　　　　1.安装：vue init webpack 项目名

　　　　　　　　在新建过程中会要输入几次回车和y，最后一步选择No I will handle that myselft，也就是创建完项目后由我自己来下载依赖

　　　　2.cd 文件夹名 ------ 进入对应安装目录　然后  npm run dev  ------启动

8.bower ------ npm包管理器中的其中一个包 - 包管理器

　　　　1.全局安装bower　　

　　　　　　npm install bower -g     

　　　　2.bower安装命令

　　　　　　如果直接下载 默认是 最高的版本

　　　　　　bower i 下载库的名字#版本号

　　　　　　bower i vue#1.0.8

　　　　3.查看版本

　　　　　　bower info vue  可查看到当前vue库所有的版本，再下载自己所需要版本

　　　　4.删除

　　　　　　bower uninstall vue//删除vue库

　　　　5.更新

　　　　　　bower update vue//更新vue库

　　　　6.bower作用

　　　　　　每次做项目的时候都依赖某一个库来开发，每次需要某一个库的时候都是百度进入库官网再找到下载的库，经常会因为官网的改版更新而在里面绕半天找不到想要的版本号，当然直接去github,CDN 都可以找到需要的库，但是总感觉这样很不优雅，直到偶然发现Bower，一个web的包管理工具，发现从此找库是一件很优雅的事