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. logistic regression浅析

    最近开始学习机器学习的相关理论知识,准备把自己的整个学习心得整理汇集成博客,一来可以督促自己,二来可以整理思路,对问题有一个更加透彻的理解,三来也可以放在网上和大家分享讨论,促进交流. 由于这次的学习 ...

  2. 离线方式部署Ambari2.6.0.0

    Hadoop生态圈-离线方式部署Ambari2.6.0.0 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 我现在所在的公司用的是CDH管理Hadoop集群,前端时间去面试时发现很多 ...

  3. Create ISO library over NFS for XEN server templates

    Based on Ubuntu – Server – install NFS on Ubuntu  – aptitude -y install nfs-kernel-server create a “ ...

  4. 关于Springboot打包错误的问题 | Failed to execute goal org.springframework.boot:spring-boot-maven-plugin

    最近在使用spring-boot整合多模块,但是在父pom中打包maven install时总会报错:Failed to execute goal org.springframework.boot:s ...

  5. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  6. 【1】【JUC】JDK1.8源码分析之ReentrantLock

    概要: ReentrantLock类内部总共存在Sync.NonfairSync.FairSync三个类,NonfairSync与FairSync类继承自Sync类,Sync类继承自AbstractQ ...

  7. Storm Topology 提交 总结---Kettle On Storm 实现

    一,目的 在学习的过程中,需要用到 PDI---一个开源的ETL软件.主要是用它来设计一些转换流程来处理数据.但是,在PDI中设计好的 transformation 是在本地的执行引擎中执行的,(参考 ...

  8. mysql Mac终端操作

    1.启动mysql :brew services start mysql 2.登陆mysql :  mysql -u root -p mysql 命令.      -u 后面接用户名 root超级管理 ...

  9. requsets模块和beautifulsoup模块

    2.requests模块方法 requests是基于Python开发的HTTP库,使用Requests可以轻而易举的完成浏览器可有的任何操作. request.get() request.post() ...

  10. nginx 全局配置

    nginx 全局配置 #user nobody; # user 主模块 ,指定nginx worker 进程的运行用户组 worker_processes ; # worker_processes 开 ...