2024年Web前端最全Vue进阶（五十五）：vue-cli 脚手架 build(1)，这些面试官常问的开发面试题你都掌握好了吗

本文链接：https://blog.csdn.net/2401_84123150/article/details/138696122

文末

我一直觉得技术面试不是考试，考前背背题，发给你一张考卷，答完交卷等通知。

首先，技术面试是一个认识自己的过程，知道自己和外面世界的差距。

更重要的是，技术面试是一个双向了解的过程，要让对方发现你的闪光点，同时也要试图去找到对方的闪光点，因为他以后可能就是你的同事或者领导，所以，面试官问你有什么问题的时候，不要说没有了，要去试图了解他的工作内容、了解这个团队的氛围。

前端面试题汇总

JavaScript

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

性能

linux

前端资料汇总

// node.js路径模块
var path = require(‘path’)
// chalk插件，用来在命令行中输入不同颜色的文字
var chalk = require(‘chalk’)
// 引入webpack模块使用内置插件和webpack方法
var webpack = require(‘webpack’)
// 引入config下的index.js配置文件，此配置文件我之前介绍了请自行查阅，主要配置的是一些通用选项
var config = require(‘…/config’)
// 下面是生产模式的webpack配置文件，请看我的webpack.prod.conf解释文章
var webpackConfig = require(‘./webpack.prod.conf’)

// 开启转圈圈动画
var spinner = ora(‘building for production…’)
spinner.start()

// 调用rm方法，第一个参数的结果就是 dist/static，表示删除这个路径下面的所有文件
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
// 如果删除的过程中出现错误，就抛出这个错误，同时程序终止
if (err) throw err
// 没有错误，就执行webpack编译
webpack(webpackConfig, function (err, stats) {
// 这个回调函数是webpack编译过程中执行
spinner.stop() // 停止转圈圈动画
if (err) throw err // 如果有错误就抛出错误
// 没有错误就执行下面的代码，process.stdout.write和console.log类似，输出对象
process.stdout.write(stats.toString({
// stats对象中保存着编译过程中的各种消息
colors: true, // 增加控制台颜色开关
modules: false, // 不增加内置模块信息
children: false, // 不增加子级信息
chunks: false, // 允许较少的输出
chunkModules: false // 不将内置模块的信息加到包信息
}) + ‘\n\n’)
// 以上就是在编译过程中，持续打印消息
// 下面是编译成功的消息
console.log(chalk.cyan(’ Build complete.\n’))
console.log(chalk.yellow(
’ Tip: built files are meant to be served over an HTTP server.\n’ +
’ Opening index.html over file:// won’t work.\n’
))
})
})


注: 如果想自己编写一个高质量的脚手架工具，建议你:


* 去补习`nodejs`，然后补习`es6`，然后再来看`webpack`官方文档，然后独立编写一个和`vue-cli`类似的脚手架，如果上面的东西看不懂，更要这样做。
* `vue-cli`还有一部分内容是关于代码测试的，这块内容的复杂度不亚于`webpack`，这些内容对`nodejs`要求比较熟悉，说白了就是基础弱的很难入门，但是测试这块内容也是非常有价值的，可以借助无界面的浏览器解析引擎，通过一句命令就可以把你的代码在不同的平台上运行，还能指出问题所在。


### 二、拓展阅读


* 《[Vue进阶（五十一）： vue-cli脚手架build目录中的webpack.base.conf.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
* 《[Vue进阶（五十二）：vue-cli脚手架build目录中的webpack.dev.conf.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
* 《[Vue进阶（五十三）：vue-cli脚手架build目录中的webpack.prod.conf.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
* 《[Vue进阶（五十四）：vue-cli脚手架build目录中的dev-server.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
* 《[Vue进阶（五十五）：vue-cli脚手架build目录中的build.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
* 《[Vue进阶（五十六）：vue-cli脚手架build目录中的karma.conf.js配置文件](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》








### 最后

小编综合了阿里的面试题做了一份前端面试题PDF文档，里面有面试题的详细解析

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

![](https://img-blog.csdnimg.cn/img_convert/45f2869b91b538dd3bb3290ba13bc806.png)  

![](https://img-blog.csdnimg.cn/20210419193354991.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0tlcGxlcl9JSQ==,size_16,color_FFFFFF,t_70)

虽只说了一个公司的面试，但我们可以知道大厂关注的东西并举一反三，通过一个知识点延伸到另一个知识点，这是我们要掌握的学习方法，小伙伴们在这篇有学到的请评论点赞转发告诉小编哦，谢谢大家的支持！