webpack中的output.filename 和output.chunkFilename
filename应该比较好理解,就是对应于entry里面生成出来的文件名。比如:
{
entry: {
"index": "pages/index.jsx"
},
output: {
filename: "[name].min.js",
chunkFilename: "[name].min.js"
}
}
生成出来的文件名为index.min.js。
chunkname我的理解是未被列在entry中,却又需要被打包出来的文件命名配置。什么场景需要呢?我们项目就遇到过,在按需加载(异步)模块的时候,这样的文件是没有被列在entry中的,如使用CommonJS的方式异步加载模块:
require.ensure(["modules/tips.jsx"], function(require) {
var a = require("modules/tips.jsx");
// ...
}, 'tips');
异步加载的模块是要以文件形式加载哦,所以这时生成的文件名是以chunkname配置的,生成出的文件名就是tips.min.js。
(require.ensure() API的第三个参数是给这个模块命名,否则 chunkFilename: "[name].min.js" 中的 [name] 是一个自动分配的、可读性很差的id,这是我在文档很不起眼的地方2.0K发现的。。。)
webpack中的output.filename 和output.chunkFilename的更多相关文章
- output.filename 与 output.chunkFilename 的区别
// webpack.config.js module.exports = { entry: './src/index.js', output: { filename: '[name].bundle. ...
- webpack 无法打包:No configuration file found and no output filename configured via CLI option
报错内容 No configuration file found and no output filename configured via CLI option.A configuration fi ...
- No configuration file found and no output filename configured via Cli option.报错
webpack手动配置webpack.config.js文件,打包时出现的报错,可以试试这种解决方案 报错如下: No configuration file found and no output f ...
- 给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积。-----力扣
给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积. 示例: 输入: [1 ...
- Webpack中hash与chunkhash的区别,以及js与css的hash指纹解耦方案
文件的hash指纹通常作为前端静态资源实现增量更新的方案之一,Webpack是目前最流行的开源编译工具之一,其强大的功能也带来很多坑(当然,大部分麻烦其实都可以在官方文档中找到答案). 比如,在Web ...
- webpack中利用require.ensure()实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...
- webpack中实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...
- Webpack中publicPath设置
webpack中的path是当我们build的时候,输出项目打包文件的位置. webpack中的publicPath是我们打算放到web服务器下的目录,如果我们要放到网站的根目录下,那么就无需设置.如 ...
- webpack中环境变量的使用方法
这节课讲解一下,在webpack打包过程中,怎么去使用一些环境变量. 首先我有一个打包配置的三个文件 "scripts": { "dev-build": &qu ...
随机推荐
- promise第一篇-简介
1. 创建一个promise对象 var promise = new Promise(function(resolve, reject){ //异步处理 //处理结束后调用resolve或reject ...
- [译]Golang中的优雅重启
原文 Graceful Restart in Golang 作者 grisha 声明:本文目的仅仅作为个人mark,所以在翻译的过程中参杂了自己的思想甚至改变了部分内容,其中有下划线的文字为译者添加. ...
- Log4net(三)——RollingFileAppender配置
RollingFileAppender配置 log4net的记录介质很多,这里只总结最常用的方式之一:RollingFileAppender. 1.日志文件名是以文件大小进行变换的 如果日志文件大小到 ...
- Spring架构简单描述
原文:https://www.shiyanlou.com/courses/document/212 Spring 概述 1. Spring 是什么 Spring是一个开源的轻量级Java SE(Jav ...
- Spring的单例实现原理-登记式单例
单例模式有饿汉模式.懒汉模式.静态内部类.枚举等方式实现,但由于以上模式的构造方法是私有的,不可继承,Spring为实现单例类可继承,使用的是单例注册表的方式(登记式单例). 什么是单例注册表呢, 登 ...
- Dijkstra算法:任意两点间的最短路问题 路径还原
#define _CRT_SECURE_NO_WARNINGS /* 7 10 0 1 5 0 2 2 1 2 4 1 3 2 2 3 6 2 4 10 3 5 1 4 5 3 4 6 5 5 6 9 ...
- android allowbackup
allowbackup 属性是在application 节点下,作用的设置为true,人们可以通过adb 命令备份一份应用的信息,然后在另外一个设备上,还原这份信息,是一种危险操作,所以,我们一般设为 ...
- Newtonsoft.Json 两个Attribute含义
1.[JsonIgnore] 看名字就知道了,通过这个Attribute可以忽略序列化某个实体类字段 2.[JsonProperty("Font")] 设置序列化到json中的实际 ...
- js 获取属性名称
$(function () { myfun(); }) function myfun() { var ...
- Ubuntu 18.04换国内源 中科大源 阿里源 163源 清华源
感觉还是18.4好用,所以最近装回了18,感觉现在18的兼容性也还可以了,深度学习的环境配置都没有问题,就是安装软件的时候有点慢,所以想要更新一下源. 第一步: 编辑/etc/apt/sources. ...