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

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的包管理工具,发现从此找库是一件很优雅的事

原文地址:https://www.cnblogs.com/yxkNotes/p/12737652.html