2020 祝安,缝隙中寻找机遇:面试题第二波:Git&Webpack

925 阅读4分钟

非常感谢,前同事行长@onlyadaydreamer分享的面经。

好吧,日行一张表情包,我们搬砖的也是很有爱的

北京现在有开始严重了,大家不要吃进口海鲜了,抗击疫情,人人有责!

直接正文!

git常用操作,怎么回滚?【后续添加相关截图】

首先git 怎么放弃修改,可以参考我以前的文章 git放弃修改

git init

在当前目录下创建.git目录,同时当前目录成为一个Git仓库。

git clone

git clone Git仓库url:将http或ssh链接指向的Git仓库拷贝到本地。
git clone Git仓库url 本地目录路径:将远程Git仓库拷贝到本地指定目录。

基本操作


使用git add添加需要追踪的新文件和待提交的更改;
    1、git add 文件:将文件添加到缓存区,该文件被标记为被追踪。
    2、git add .:缓存当前目录下所有文件,不包括已删除的文件。
使用git status和git diff查看有何改动;
    1、git diff:比较工作区和缓存区的不同。
    2、git diff --cached:比较缓存区和仓库的不同。
    3、git diff 文件:比较指定文件在工作区和缓存区的不同。
    4、git diff 文件 --cached:比较指定文件在缓存区和仓库的不同。
    5、git status:显示当前仓库的最新状态。
    6、git status -s:当前仓库的最新状态的简介。
使用git commit提交快照。将缓存写入仓库中。
    1、git add是工作区->缓存区,git commit是缓存区->仓库。
    2、git commit -m "本次提交说明":一次性将缓存区所有文件修改提交到仓库的当前分支。
    3、git commit -am "本次提交说明":自动把所有已经跟踪过的文件缓存,并提交到仓库。常用于跳过git add步骤快速提交。
    4、git commit --amend "本次提交说明":重新提交。此次提交代替上一次提交的结果。尤其适用于提交完了才发现漏掉了几个文件没有添加,或者提交信息写错了的情况。
git push
    git push <remote-repo-shortname> <local-branch>:将本地分支推送到远程仓库。
git pull
    git pull <remote-shortname> <local-branch>:拉取远程仓库最新提交,并合并到指定的本地分支上。
git branch分支
    git branch:列出本地分支列表。当前分支前会标有*号。
    git branch -r:列出远程分支列表。
    git branch -a:列出所有分支列表。
    git branch 分支:创建新分支。
    git branch -d 分支:删除指定分支。
    git branch -v -a:查看所有分支的最后一次提交。
git checkout
    git checkout 分支:切换到指定分支。
    git checkout -b 分支:创建并切换到指定分支。
git merge
    git merge 分支:将指定分支合并到当前分支上。
合并冲突
    不同分支修改了相同区块的代码时,合并分支时git会将此部分标记为冲突,需要用户手动去修改。
    可用git diff查看冲突详情

webpack3和webpack4的区别

先说一下,webpack 5.x 都有了。还要纠结还做个吗? 不过貌似改动不大,4.x的还是主流

用webpack做过哪些优化?
比如我使用过DLLPlugin和DLLReferencePlugin, 可以用来分离第三方代码并且不打包这些代码。我试过生产环境下大概可以缩减一半的打包时间。
优化babel-loader的速度,可以开启cacheDirectory缓存,使用include或者exclude来有条件的编译。
HappyPack,可以用来多线程构建充分发挥多核CPU的优势。

webpack的prefetch

只知道是把一些资源放在浏览器空闲时间来提前下载好

webpack的loader和plugin有什么区别?

loader 在下面有说到

webpack 4.x基本使用 欢迎👍 收藏!!!

Webpack 配置【一】 欢迎👍 收藏!!!

Webpack 配置【二】 欢迎👍 收藏!!!

说下babel的原理

babel大概分为三大部分:
    解析:把代码(字符串)转换为AST(抽象语法树),经历语法分析、词法分析
    转换:访问AST节点进行变换操作生成新的AST
    生成:以新的AST为基础生成代码

说下loader的原理

loader是一个node模块,loader会导出一个函数,把源模块转换为通用模块。module.rules.use, use数组中loader的执行顺序是从最后一个到第一个

样式:style-loader、css-loader、less-loader、sass-loader等 文件:raw-loader、file-loader 、url-loader等 编译:babel-loader、coffee-loader 、ts-loader等 校验测试:mocha-loader、jshint-loader 、eslint-loader等

      {
        test: /\.less$/,
        loader: ['vue-style-loader', 'css-loader', 'postcss-loader', 'less-loader']
      },