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的更多相关文章

  1. output.filename 与 output.chunkFilename 的区别

    // webpack.config.js module.exports = { entry: './src/index.js', output: { filename: '[name].bundle. ...

  2. 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 ...

  3. No configuration file found and no output filename configured via Cli option.报错

    webpack手动配置webpack.config.js文件,打包时出现的报错,可以试试这种解决方案 报错如下: No configuration file found and no output f ...

  4. 给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积。-----力扣

    给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积. 示例: 输入: [1 ...

  5. Webpack中hash与chunkhash的区别,以及js与css的hash指纹解耦方案

    文件的hash指纹通常作为前端静态资源实现增量更新的方案之一,Webpack是目前最流行的开源编译工具之一,其强大的功能也带来很多坑(当然,大部分麻烦其实都可以在官方文档中找到答案). 比如,在Web ...

  6. webpack中利用require.ensure()实现按需加载

    webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...

  7. webpack中实现按需加载

    webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...

  8. Webpack中publicPath设置

    webpack中的path是当我们build的时候,输出项目打包文件的位置. webpack中的publicPath是我们打算放到web服务器下的目录,如果我们要放到网站的根目录下,那么就无需设置.如 ...

  9. webpack中环境变量的使用方法

    这节课讲解一下,在webpack打包过程中,怎么去使用一些环境变量. 首先我有一个打包配置的三个文件 "scripts": { "dev-build": &qu ...

随机推荐

  1. 增加swap分区,文件形式

    查看swap a: sudo swapon -s b: free -m 文件方式: 1. 生成 生成一个1Gb(bs*count)的文件 [root@localhost ~]# dd if=/dev/ ...

  2. 搭建ftp

    相信很多人都知道ftp吧.打个比方.在你们公司或者学校里面有一个ftp地址,里面存放了你们所需要的一些常用的资源.这样的话你们就可以随时登录这个ftp来拉取你所需要的资源(在范围内),简单的来说,ft ...

  3. centos7下安装redis的步骤

    原贴地址:https://www.cnblogs.com/zuidongfeng/p/8032505.html 我linux服务器上是这样启动的: cd /tool/redis/redis-3.2.8 ...

  4. Hbase记录-HBase增删改查

    HBase创建数据   本章将介绍如何在HBase表中创建的数据.要在HBase表中创建的数据,可以下面的命令和方法: put 命令, add() - Put类的方法 put() - HTable 类 ...

  5. gitlab与pycharm结合

    一切都在图中 点开pycharm里的菜单选项 设置git代码仓库的地址 修改了代码之后,如何推送到git服务器上 通过pycharm下载代码仓库 pycharm中如何设置分支 pycharm新建了分支 ...

  6. Aircrack-ng介绍

    1.介绍 Aircrack-ng主要使用了两种攻击方式进行WEP破解:一种是FMS攻击:一种是KoreK攻击. 2.主要组件 1.aircrack-ng 主要用于WEP及WPA-PSK密码的恢复,主要 ...

  7. luogu 2294 狡猾的商人 带权并查集

    此题做法多啊 带权并查集,区间dp,前缀和,差分约束 1.自己写的前缀和, 11 #include<bits/stdc++.h> #define rep(i,x,y) for(regist ...

  8. Java EE之Hibernate异常总结【2】Field 'id' doesn't have a default value

    Field 'id' doesn't have a default value问题解决方法 因为assigned是指主键是由人工分配的,而native则指主键值由库自动给出. <generato ...

  9. cocos2d-x 2.1.4 项目配置过程

    http://cocos2d-x.org 下载cocos2d-x 2.1.4 使用project-creator.py脚本创建Cocos2d-win32 Application项目 1.先下载Wind ...

  10. [SDOI2010]古代猪文 (欧拉,卢卡斯,中国剩余)

    [SDOI2010]古代猪文 \(solution:\) 这道题感觉综合性极强,用到了许多数论中的知识: 质因子,约数,组合数 欧拉定理 卢卡斯定理 中国剩余定理 首先我们读题,发现题目需要我们枚举k ...