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. A*算法(附c源码)

    关于A*算法网上介绍的有很多,我只是看了之后对这个算法用c写了一下,并测试无误后上传以分享一下,欢迎指正!下面是我找的一个介绍,并主要根据这个实现的. 寻路算法不止 A* 这一种, 还有递归, 非递归 ...

  2. Python IPy模块

    #!/usr/bin/env python # -*- coding: utf-8 -* # Created by YangYongming at 2018/09/17 20:22 # FileNam ...

  3. RocketMQ在windows环境下的安装

    原博地址:https://www.jianshu.com/p/4a275e779afa 一.预备环境 1.系统 Windows 2. 环境 JDK1.8.Maven.Git 二. RocketMQ部署 ...

  4. java虚拟内存设置 防止内存溢出 OutOfMemory【转】【原】

    outofmemory permgen 这个问题主要还是由 java.lang.OutOfMemoryError: Java heap space 引起的. 有这两种解决方法: 1.设置环境变量 解决 ...

  5. 浅谈分词算法(5)基于字的分词方法(bi-LSTM)

    目录 前言 目录 循环神经网络 基于LSTM的分词 Embedding 数据预处理 模型 如何添加用户词典 前言 很早便规划的浅谈分词算法,总共分为了五个部分,想聊聊自己在各种场景中使用到的分词方法做 ...

  6. DotNetBar TreeGx用法

    添加一个节点和4个子节点treeGXHelp.Nodes[].Text = textBoxDropDownHelp.Text + "的主题"; treeGXHelp.Nodes[] ...

  7. FastReport 套打全攻略

    http://blog.csdn.net/jinzhili/article/details/500263 FastReport 套打全攻略  2005-7-13 22:10  原创//以设计套打行为6 ...

  8. Selenium自动化Page模式(Python)

    Selenium是当前主流的web自动化工具,提供了多种浏览器的支持(Chrome,Firefox, IE等等),当然大家也可以用自己喜欢的语言(Java,C#,Python等)来写用例,很容易上手. ...

  9. CSS之清除浮动(span/clearfix)

    一.问题描述 web网页设计中,在div元素中有时候常伴有图文结合的post组件.为了使得文本在图像周围环绕,那么需要对图像区域使用float浮动.如果不做清除浮动,则会出现如下结果: 图像比文本高, ...

  10. 阿里云3台机器组成集群配置ssh免密码登陆

    1 查询阿里云局网ip 注意:需要配置同一地区同一可用区的机器 才是一个局网 2 配置好hosts文件 3 hostname确认也是正确的 4 生成公钥私钥 三台机器同样操作 ssh-keygen - ...