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. python---自定义分页类

    # coding:utf8 # __author: Administrator # date: 2018/3/7 0007 # /usr/bin/env python import tornado.w ...

  2. Study 1 —— Python简介

    Python与其他语言的区别C\C++:学习成本高,学习周期长,偏系统底层,在开发硬件驱动.嵌入式.游戏引擎开发等领域有广泛的应用:JAVA:目前使用最广泛的编程语言,第一个跨平台运行的语言,在大型E ...

  3. java实现获取当前年月日 小时 分钟 秒 毫秒

    java代码实现如下 view source print?     /**      * 英文简写(默认)如:2010-12-01      */     public static String F ...

  4. Every-SG游戏

    参考自 石家庄二中 贾志豪 IOI2009国家集训队论文 <组合游戏略述—— 浅谈 SG 游戏的若干拓展及变形> 一.定义 游戏规则加上 对于还没有结束的所有单一游戏,游戏者必须对其进行决 ...

  5. linux 命令收集 阿里云nginx升级等 查看磁盘空间 版本等

    —————————————————— 查磁盘 df -h此命令直观的呈现出磁盘大小有多少Gdf -hl文件系统 容量 已用 可用 已用% 挂载点/dev/hdb2 75G 75G 0 100% /就是 ...

  6. UEditor百度编辑器,工具栏自定义添加一个普通按钮

    根据网上前辈提供的,还真的不错,下面也整理一下 添加一个名叫“macros”的普通按钮在工具栏上: 第一步:找到ueditor.config.js文件中的toolbars数组,增加一个“macros” ...

  7. 【BZOJ】3282: Tree(lct)

    http://www.lydsy.com/JudgeOnline/problem.php?id=3282 复习了下lct,发现两个问题.. 1:一开始我以为splay那里直接全部rot(x)就好了,然 ...

  8. JavaScript之事件绑定多个序列执行方法

    //一种事件绑定多个方法:以加载事件为例 function addEventLoad(func,isLog) { var oldOnLoad = window.onload; if (typeof w ...

  9. 第16月第25天 tableView设置UITableViewStyleGrouped顶部有空余高度

    1. 正确的处理方法 1)设置标头的高度为特小值 (不能为零 为零的话苹果会取默认值就无法消除头部间距了) UIView *view = [[UIView alloc]initWithFrame:CG ...

  10. D - Laying Cables Gym - 100971D (单调栈)

    题目链接:https://cn.vjudge.net/problem/Gym-100971D 题目大意:给你n个城市的信息,每一个城市的信息包括坐标和人数,然后让你找每一个城市的父亲,作为一个城市的父 ...