开发环境

开发环境

git 常用命令

git add . 把所有修改后的文件添加到本地git checkout xxx 把 xxx 文件还原到未修改的状态git commit -m \"xxx\" 提交一条记录git push orign master 把分支推送到远程服务端git pull origin master 从远程服务端拉取分支git branch 查看分支git checkout -b xxx 创建并切换分支git checkout xxx 切换分支git merge xxx 把 xxx 分支合并到当前分支

git stash 暂存工作区代码git stash list 查看 stashgit stash pop 恢复工作区，同时删除 stash 内容

chrome 调试工具

ElementsConsoleSourceNetworkApplicationdebugger

移动端 H5 抓包

工具

windows 用 FiddlerMac OS 用 Charles

抓包

流程

手机和电脑连同一个局域网将手机代理到电脑上（电脑的IP）手机浏览网页，即可抓包查看网络请求

网址代理

Charles:Tools -> Map Remote Settings -> Enable Map Remote

https

Charles:Proxy -> SSL Proxy Settings -> Enable SSL ProxyHelp -> SSL Proxying -> Install Charles Root Certificate on a Mobile

webpack 配置

ES6模块化，浏览器暂不支持ES6语法，浏览器并不完全支持压缩代码，整合代码，让网页加载更快

如何配置 babel

webpack.config.js

html-webpack-plugin 解析 HTMLwebpack-dev-server 启动服务

@babel/core babel 的核心，把 ES6 转成 ES5@babel/preset-env babel 配置的集合，在 .babelrc 文件中配置 {\"presets\": [\"@babel/preset-env\"]}babel/loader 给webpack用的插件

ES6 的模块化

export 导出

可分别导出，或导出集合

只导出一个，用 export default，但导入时不可用解构赋值

import 导入

如何配置 webpack 生产环境

webpack.prod.js

mode: 'production'

contenthash 根据代码内容算出来一个不规则的 hash 值；如果代码内容变了，hash 值会变；如果代码内容不变，hash 值不变。

能最大程度让文件命中 http 缓存，让页面加载更快

前端常用的 linux 命令

ssh @<userName>/<IP> 输入密码后，登录 linux 线上机

ls 查看文件夹ls -a 查看所有文件，包括隐藏文件ll 列表形式查看文件clear 清屏mkdir <file> 创建文件夹rm <file> 删除文件rm -rf <file> 删除文件夹cd <path> 定位到目录mv <name> <newName> 修改文件名mv <file> <path> 移动文件cp <file1> <file2> 拷贝

vi <file> 新建并打开 vim 编辑器vim <file> 打开 vim 编辑器查看cat <file> 打印文件内容head <file> 打印文件头几行tail <file> 打印文件尾几行grep <keywork> <file> 查找关键字

vim 编辑器

i 进入 INSERT 模式ESC 退出 INSERT 模式 :w 写入:q 退出 vim:q! 强制退出 vim，不保存修改内容

vimtutor 学习 vim 相关命令