npm
# npm
# 安装包
安装 gitlab 上的库: npm install -g git+ssh://git@10.1.1.1:wangzhen/generator-roninwz-back.git
# cnpm 使用
cmd 上的输入 npm 命令卡死可能原因是因为 npmrc 文件路径配置错
npm install -g cnpm --registry=https://registry.npm.taobao.org
# nrm 使用
安装：cnpm install -g nrm
nrm ls 会报错，按照错误第 4 行提示的路径，找到 cli.js 的第 17 行
修改为：const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc')
nrm ls 显示可用源
nrm use npm 切换源
2
# npm 命令
- 查看配置结果
npm config ls
- 查看 node 和 npm 版本
node -v
npm -v
- 查看全局安装的模块
npm ls -g
- 初始化一个 package.json 文件
npm init
npm init -y 初始化一个package.json文件，加上-y就会默认生成该文件，无需一步一步填写
- 查看 npm 全局包安装位置
npm root -g
# angular 命令
- 创建项目
ng new my-angular2-app
- 启动项目
进入刚刚创建的项目目录，即./my-angular2-app
ng serve
ng serve --open
--open 标志会打开浏览器，并访问 http://localhost:4200/
- 创建名为 heroes 的新组件
ng generate component heroes
- angular 版本：
ng version
- 生成指令：
ng g directive my-new-directive
- 生成管道：
ng g pipe my-new-pipe
- 生成 service:
ng g service my-new-service
- 生成 module:
ng g module my-module
- 生成接口：
ng g interface my-new-interface
- 生成 class:
ng g class my-new-class
- 生成 enum:
ng g enum my-new-enum
# vue 命令
- Vue cli3 初始化项目
npm install -g @vue/cli
vue create my-project
npm run serve
- 以图形化界面创建和管理项目：
vue ui
- Vue cli2 初始化项目
npm install -g @vue/cli-init
vue create my-project
npm run dev
# react npm 包
- 创建项目
npm install -g create-react-app
create-react-app my-app
cd my-app/
npm start
2
3
4
# typescript npm 包
安装 typescript
npm install typescript -g
检查 typescript 版本号
tsc -v
# less 和 sass npm 包
- 安装 less 编译 less
npm install less –g
编译：
lessc example/example.less example/example.css
- 安装 node-sass 编译 sass
npm install node-sass -g
编译：
node-sass input.scss output.css
监视：
node-sass --watch input.scss output.css
- sass 命令：
sass -i sassScript sass 脚本命令行
sass transform.scss ../css/transform.css sass 编译
# npm 包
# node 初始化 npm 包列表
npm install -g cnpm --registry=https://registry.npm.taobao.org
npm install webpack -g
npm install @angular/cli -g
npm install typescript -g
npm install vue-cli -g
npm install -g @vue/cli-init
npm install rimraf -g
npm install -g create-react-app
npm install -g nrm
# npm 常用开发包
moment JS 日期类库
dayjs
一个轻量的处理时间和日期的 JavaScript 库
sass 依赖包
- node-sass
- sass-loader
lodash JS 工具库
shelljs 在 js 文件中执行 shell 命令
chalk 控制台字符样式
semver 语义化版本
node-schedule 定时任务
cssnano 插件库 压缩和优化 css axios 请求库 vconsole 手机端调试 dsbridge 原生 Js 交互 jsencrypt RSA 加密 crypto AES 加解密
# vue 相关 npm 包
vue-qr 二维码生成
vue-wechat-title Vue 动态改变 title
cs-ruler vue 刻度尺组件
vue-clipboard2 vue 剪切板功能
vue-video-player vue 播放器插件
# npm 常用工具包
- 删除 node_modules
安装：
npm install rimraf -g
使用：
rimraf node_modules
- lighthouse 评估性能报告
安装： npm install lighthouse -g
使用：lighthouse https://juejin.im/books
- md 转 html
安装：
npm install i5ting_toc -g
使用：
i5ting_toc -f XXXX.md
- 生成目录 tree.md
安装：
cnpm install treer -g
使用：
treer -e tree.md -i "/node_modules|.git/"
- url 转 html/text/markdown 文件：clean-mark
安装：
npm install clean-mark -g
转 markdown：
clean-mark url(代码块会转换有问题)
转 html：
clean-mark url -t html
# npm 发布包
发布指定包步骤：
进入包根目录下
修改 package.json 中的 version 版本
输入
npm publish
删除已发布的 npm 包 npm unpublish xxx --force
注意：删除 npm 市场的包 24 小时后才能重新发布相同名称的包
- 发布 scope 包：
npm publish --access public
# npm 使用问题汇总
# npm 安装失败解决办法
npm ERR! code EINTEGRITY
清除缓存 npm cache clean --force
删除 node_modules 文件夹：rimraf node_modules
删除 package-lock.json:package-lock.json 是在 npm install 安装时生成的一份文件，用以记录当前状态下实际安装的各个 npm package 的具体来源和版本号，如果没有这个文件的话，那么 npm install 将下载大版本下的最新的包
npm install