摘要:
Webpack解析图片 使用file-loader解析图片资源 在组件中引入并使用 Asset是图片的哈希 Asset Size Chunks Chunk Names 982163fc946587581278ea658d60e8e2.jpg 35.8 KiB [emitted] reactComp. 阅读全文
摘要:
Webpack 解析css css-loader: 加载css对象,并转换成commonjs对象 style-loader: 将样式写入style标签并插入到header中 安装loader npm i style-loader@0.23.1 css-loader@2.1.1 -D 配置webpac 阅读全文
摘要:
webpack解析ES6 webpack原生可以识别js,但不能识别ES6语法 因此需要借助babel-loader以及.babelrc配置文件 babel-preset是一系列babel plugin的集合 安装以下npm包 npm i @babel/core@7.4.4 @babel/prese 阅读全文
摘要:
Mode Mode 用于指定当前的构建环境是 production、development 还是 none 设置 mode 可以使用 webpack 内置的函数 mode 的默认值为 production 设置了 mode 之后会对应执行开发/生成环境具有的一些插件与功能,如果设置成 none,那么 阅读全文
摘要:
plugins 理念 plugins 与 loaders loaders: 处理 webpack 用来解析 webpack 不能转换的文件,主要作用是翻译 plugins: 用于 bundle 文件的优化、资源管理和环境变量注入,作用于整个构建过程,主要作用是增强 任何 loader 没办法做的事情 阅读全文
摘要:
loaders webpack 开箱即用,但是 webpack 只支持 js 和 json 文件类型,不支持其他的文件(比如 html,css,字体等) loader 可以支持其他文件类型并把它们转换成有效的模块,文件被 loaders 解析完之后才可以加到依赖图中 loader 本身是一个函数,接 阅读全文
摘要:
entry entry: 指定打包入口 理解依赖图 webpack是一个模块打包器 webpack把一切资源都当成模块 模块之间存在依赖关系 根据入口文件找到依赖,依赖之中又有依赖,所有依赖形成依赖树,将依赖文件加入依赖图 遍历完之后生成打包资源 单入口 entry的值是相对路径,总是相对于webp 阅读全文