Output配置output配置选项告诉webpack如何将编译后的文件写入磁盘。请注意,虽然可以有多个entry点,但只output指定了一个配置。

  • filename to use for the output file(s).

webpack.config.js

module.exports = {
output: {
filename: 'bundle.js',
}
};

This configuration would output a single bundle.js file into the dist directory.

如果您的配置创建了多个“块”(与多个入口点一样或使用CommonsChunkPlugin等插件时),则应使用替换来确保每个文件都具有唯一名称。

module.exports = {
entry: {
app: './src/app.js',
search: './src/search.js'
},
output: {
filename: '[name].js',
path: __dirname + '/dist'
}
}; // writes to disk: ./dist/app.js, ./dist/search.js

高级

以下是使用CDN和资产哈希的更复杂的示例:

config.js

module.exports = {
//...
output: {
path: '/home/proj/cdn/assets/[hash]',
publicPath: 'http://cdn.example.com/assets/[hash]/'
}
};

如果publicPath在编译时不知道输出文件的最终结果,则可以将其留空并在运行时通过__webpack_public_path__入口点文件中的变量动态设置:

__webpack_public_path__ = myRuntimePublicPath;

// rest of your application entry

对webpack的初步研究3的更多相关文章

  1. 对webpack的初步研究8

    模块 编辑文档 在模块化编程中,开发人员将程序分解为称为模块的离散功能块. 每个模块的表面积小于完整程序,使验证,调试和测试变得微不足道.编写良好的模块提供了可靠的抽象和封装边界,因此每个模块在整个应 ...

  2. 对webpack的初步研究7

    Configuration 您可能已经注意到很少有webpack配置看起来完全相同.这是因为webpack的配置文件是导出对象的JavaScript文件.然后,webpack根据其定义的属性处理此对象 ...

  3. 对webpack的初步研究6

    Plugins 插件是webpack 的支柱.webpack本身构建在您在webpack配置中使用的相同插件系统上! 它们也是这样做的目的别的,一个装载机无法做到的. Anatomy webpack  ...

  4. 对webpack的初步研究5

    Loaders 加载器是应用于模块源代码的转换.它们允许您在处理import或“加载” 文件时预处理文件.因此,加载器有点像其他构建工具中的“任务”,并提供了处理前端构建步骤的强大方法.加载器可以将文 ...

  5. 对webpack的初步研究4

    Mode string module.exports = { mode: 'production' }; webpack --mode=production The following string ...

  6. 对webpack的初步研究2

    Entry Points 如“ 入门”中所述,有多种方法可以entry在webpack配置中定义属性.我们会告诉你,你的方法可以配置的entry属性,除了解释为什么它可能对你有用 Single Ent ...

  7. 对webpack的初步研究1

    一.概念: 1.webpack的核心是用于现代JavaScript应用程序的静态模块捆绑器.当webpack处理您的应用程序时,它会在内部构建一个依赖关系图,它映射您的项目所需的每个模块并生成一个或多 ...

  8. iOS多线程的初步研究(六)

    iOS多线程的初步研究(六) iOS平台提供更高级的并发(异步)调用接口,让你可以集中精力去设计需完成的任务代码,避免去写与程序逻辑无关的线程生成.运行等管理代码.当然实质上是这些接口隐含生成线程和管 ...

  9. iOS多线程的初步研究3

    iOS多线程的初步研究(三) 弄清楚NSRunLoop确实需要花时间,这个类的概念和模式似乎是Apple的平台独有(iOS+MacOSX),很难彻底搞懂(iOS没开源,呜呜). 官网的解释是说run ...

随机推荐

  1. leetcode 720. 词典中最长的单词

    /* 1.hashtable 把每个字符串都放到hashtable中 a.排序 长度不同,长的放在前面,长度相同,字典序小的放在前面 b.不排序 遍历数组,对于每个字符串判断它的所有前缀是否都在has ...

  2. 纯CSS3写一个立方体并在鼠标悬停的时候无限循环旋转

  3. 前后端分离项目中后台集成shiro需要注意的二三事

    1. 修改 Shiro 认证失败后默认重定向处理问题 a. 继承需要使用的 ShiroFilter,重载 onAccessDenied() 方法: @Override protected boolea ...

  4. Delphi XE2 之 FireMonkey 入门(30) - 数据绑定: TBindingsList: TBindExpression 的 OnAssigningValue 事件

    Delphi XE2 之 FireMonkey 入门(30) - 数据绑定: TBindingsList: TBindExpression 的 OnAssigningValue 事件 表达式中的函数有 ...

  5. 阶段1 语言基础+高级_1-3-Java语言高级_09-基础加强_第2节 反射_11_反射_案例

    student定义sleep方法 用反射+配置文件 定义配置文件 src下new file.新建 加载配置文件.Properties里面有一个load方法,可以加载.properties结尾的配置文件 ...

  6. python库文件文档的查看

    python库文件文档的查看 第一步:cmd窗口输入:python -m pydoc -p 4567,后台运行 第二步:浏览器中打开http://localhost:4567/

  7. ClientDataSet初步使用

    https://blog.csdn.net/onebigday/article/details/5602619 ClientDataSet初步使用 2010年05月18日 08:36:00 阅读数:5 ...

  8. 解决旋转屏幕闪退在androidManifest.template.xml里,activity项添加:

     解决旋转屏幕闪退在androidManifest.template.xml里,activity项添加:android:configChanges="orientation|keyboard ...

  9. python基础-5.1几种常见的排序算法

    一.冒泡排序(BubbleSort) 步骤: 比较相邻的元素,如果第一个比第二个大,就交换他们两个. 循环一遍后,最大的数就“浮”到了列表最后的位置. 将剩下的数再次循环,直道所有的排序完成 def ...

  10. python函数纯概念汇总(一)

    在使用python的时候由于前期基本概念没有分清楚,所以需要重新归纳汇总学一学. 一.什么是函数: 函数一词来源于数学,但编程中的「函数」概念,与数学中的函数是有很大不同的,编程中的函数在英文中也有很 ...