【总结】常用指令以及快捷键清单

webpack等工具操作

• 自动创建package.json文件：npm init
• 如何根据package.json来自动安装包：npm install
• npm具体安装某个组件：npm install name -g
• 如何手动更新npm中指定的插件版本号:修改package.json中依赖包版本，执行npm install --force
• 清理npm：npm cache clean --force
• 设置npm代理地址：npm config set registry http://registry.cnpmjs.org
• 淘宝npm代理：npm config set registry https://registry.npm.taobao.org
• 查看设置过的源地址：npm config get registry
• 默认的是Vue2.0,如果要使用Vue 1.X的话，执行下面的操作：vue init webpack#1.0 my-project
• 安装webpack
  • 全局安装：npm install -g webpack
  • 安装到你的项目目录: npm install --save-dev webpack
• linux系统下执行npm install 没权限创建node-modules下的目录：npm install --unsafe-perm
• 查看webpack安装的版本：npm info webpack 显示的第一条就是版本号

vue操作

• 根据脚手架快速配置webpack+vue+vueRouter+vuecli工程：$ vue init webpack vuedemo
• 如果使用SCSS需要安装sass-loader：npm install sass-loader node-sass webpack --save-dev
• vue-router中路由懒加载的方式引入插件：npm install babel-plugin-dynamic-import-node --save-dev

安装完成后进入工程名称再根据原来项目的配置文件初始化：

$ cd vuedemo

$ npm install

• vue-cli（2.x）安装：npm install -g vue-cli
• vue-cli（3.x）安装：npm install -g @vue/cli 
• vue-cli创建项目：vue create hello-world
• 卸载vue-cli（2.x）：npm uninstall -g vue-cli
• ES6 中用来传递异步消息的的Promise，而IE低版本的浏览器不支持，需要安装polyfill:npm install --save babel-polyfill
• npm install出现"Unexpected end of JSON input while parsing near"错误解决方法：npm cache clean -force

git命令相关操作

• 克隆github项目：git clone 仓库地址
• 查看本地及远程分支：git branch -a
• 查看本地分支：git branch
• 查看远程分支：git branch -r
• 本地创建分支dev并切换到该分支：git checkout -b dev origin/dev
• 切换到本地分支v2.0：git checkout v2.0（切换到主分支：git checkout master）
• cd : change directory的简写，改变目录的意思，就是切换到哪个目录下， 如 cd e:\fff 切换 E 盘下面的fff 目录。当我们用cd 进入文件夹时,我们可以使用 通配符*, cd f*, 如果E盘下只有一个f开头的文件夹,它就会进入到这个文件夹.
• 添加远程仓库地址：git remote add origin https://git.github.com.cn....online.git
• 查看远程配置：git remote -v
• 删除远程配置：git remote remove origin
• 推送本地分支到远程仓库并在远程仓库创建新分支：$ git push <远程主机名> <本地分支名>:<远程分支名>
• 克隆SVN代码到git：git svn clone 地址/template --no-metadata --trunk=trunk --tags=tags --branches=branches --authors-file=author.txt template

git代码提交规范：

feat - 新功能 feature
fix - 修复 bug
docs - 文档注释
style - 代码格式(不影响代码运行的变动)
refactor - 重构、优化(既不增加新功能，也不是修复bug)
perf - 性能优化
test - 增加测试
chore - 构建过程或辅助工具的变动
revert - 回退
build - 打包

例如：

1.[feat]新功能xxx
2.[fix]修复xxx问题
3.[perf]优化xxx代码
4.[build]打包xxx文件
5....等等

 

doc命令操作相关

• doc命令到某个盘：d:
• doc命令到某个文件夹下：cd public
• doc命令返回上级目录：cd..
• doc命令创建文件夹：md public（指到某个文件夹或者盘下面再执行md,后面跟一个创建的文件名即可创建）

• 使用cmd命令新建某个文件夹：mkdir test
• 使用cmd命令删除文件夹下所有文件：rmdir /s/q dist（删除当前目录下的dist文件夹以及下面的所有文件）
  • /s 是代表删除所有子目录跟其中的档案
  • /q 是不要它在删除档案或目录时，不再问我 Yes or No 的动作
  • 要删除的目录前也可以指定路径，如：rmdir /s/q d:\webpack\test（把磁盘驱动器 D 的webpack文件夹里面的test文件夹中的所有东西全部删除）
• 使用cmd命令删除某个文件，如删除a.txt文件：del a.txt
• 使用cmd命令查看当前目录下的文件列表：dir

其它操作

Hbuilder中配置cmd

• 1.运行——>外部工具——>外部工具 配置
• 2.新建一个名为cmd（随意命名）的外部工具：
  • 名称：cmd
  • 要执行的命令或文件：C:\Windows\System32\cmd.exe
  • 工作目录：${selected_resource_loc} 基于选中文件夹的绝对路径
  • (先用鼠标选中要cmd.exe执行的文件夹再选择【cmd】运行。)

钉钉内网穿透工具 

• 工具地址：https://ding-doc.dingtalk.com/doc#/kn6zg7/hb7000
• 命令：.\ding -config=.\ding.cfg -subdomain=abcde 8080
• 启动完客户端后，你访问http://abcde.vaiwan.com/xxxxx都会映射到 http://127.0.0.1:8080/xxxxx

 其它

• 检查node是否正确安装：node --version
• 检查npm是否正确安装：npm --version
• 检查npx是否正确安装：npx --version

npm是一个node package安装工具。
npx的作用是先检查本地有没有安装某个package，如果没有去远程registry找，找到的话直接使用，不用下载到本地node-modules包里面，这样就能优化本地项目的大小，也可以避免安装package到全局。

• excel换行：alt+enter
• PS填充前景色的快捷键：Alt+Delete
• PS填充填充背景色快捷键：Ctrl+Delete
• 给自己的博客园装饰萌萝莉（live2d）