随笔分类 - 工程化与webpack
摘要：好家伙,学习新工具 1.为什么我们需要包管理器? 关于npm我们已经知道了,这是我们项目的包管理器, 我们现在用的无比顺手的工具,都是在无数的竞争中杀出来的,他们淘汰了无数的产品 首先,倘若我们不使用npm,那么我们应该如何去新建一个前端项目? 纯手工,把我们项目需要的项目一个个下载到我们的项目里面
阅读全文
摘要：好家伙, 当我们要各种两个文件去引用别的文件时,一般这么写 import msg from '../../msg.js' 那么如果文件藏得很深,'../'会变得很多,不美观,也不直观 所以我们又又又可以借助一个小工具"@" 在webpack.config.js文件中与("module"属性平级)属性
阅读全文
摘要：好家伙，Source Map没听过 1.什么是Source Map? 字面意义上来看应该是个好东西 Source Map 就是一个信息文件，里面储存着位置信息。 也就是说，Source Map 文件中存储着压缩混淆后的代码所对应的转换前的位置。 有了它，出错的时候，除错工具将直接显示原始代码，而不是
阅读全文
摘要：好家伙，到了打包发布这一步了 1.配置打包命令： 在package.json 文件的 scripts 节点下，新增 build 命令如下： "scripts": { "dev": "webpack serve", // 开发环境中，运行 dev 命令 "build": "webpack --mode
阅读全文
摘要：好家伙， 1.打包处理js文件中的高级语法 webpack只能打包处理一部分高级的JavaScript 语法。对于那些webpack无法处理的高级js 语法，需要借 助于 babel-loader 进行打包处理。 例如 webpack无法处理下面的JavaScript代码： // 1.定义了名为 i
阅读全文
摘要：好家伙， 1.什么是base64? 图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址。 这样做有什么意义呢？我们知道，我们所看到的网页上的每一个图片，都是需要消耗一个 http 请求下载而来的 没错，不管如何，图片的下载始终都要向服务器发出请求，要是图片的下
阅读全文
摘要：好家伙 先扩充一下知识点: 什么是.less文件? 作为一名前端开发的同学，很多时候我们都无法避免地要去写大量的 CSS 代码， 而且耗费的时间还不少，所以学习一种能够提升开发效率的 CSS 预处理器是必不可少的 答:Less （Leaner Style Sheets 的缩写） 是一门向后兼容的 C
阅读全文
摘要：好家伙， 1.webpack配置中devServer节点的常用配置项 devServer:{ //首次打包完成后，自动打开浏览器 open:ture, //在http协议中，如果端口号是80，则可以被省略(只有) port:80 //指定运行的主机地址 host：'127.0.0.1' } 注意:凡
阅读全文
摘要：好家伙， 1.html-webpack-plugin的作用 讲一下为什么需要这个插件 存在问题:在点开locahost:8080之后出现的是项目的根目录,而不是网页 这时候需要再点开scr文件夹才能看见index首页 所以我们想要一进8080就能够看到index首页, 解决方法:我们可以把index
阅读全文
摘要：好家伙， 1.webpack中的默认约定 默认的打包入口文件为src -->index.js 默认的输出文件路径为dist -->main.js 既然有默认，那么就说明肯定能改 2.entry和output 在webpack.config.js配置文件中， 通过entry节点指定打包的入口。 通过o
阅读全文
浙公网安备 33010602011771号