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. C\C++语言中的宏多重展开和递归展开

    宏定义中的#,## 1. 宏中的参数前面使用一个#,预处理器会把这个参数转换为一个字符数组     2.记号粘贴操作符(token paste operator): ##            “## ...

  2. sqlite时间类型

    SQLite分页显示:Select * From news order by id desc Limit 10 Offset 10这篇文章是根据 SQLite 官方 WIKI 里的内容翻译,如果有什么 ...

  3. 《HTML5 高级程序设计》

    第一章 HTML5 概述 开发 HTML5 的组织 Web Hypertext Application Technology Working Group (WHATWG):开发 HTML 和 Web ...

  4. docker搭建harbor私有镜像库

    创建harbor私有镜像库 一.部署准备: harbor软件包   在部署节点上: 1)解压harbor的软件包将harbor目录下所有文件发送到/opt/目录下   tar zxvf harbor- ...

  5. 分享:陆行鸟BGM合集

    第39首是原版哦 https://pan.baidu.com/mbox/homepage?short=pMkAqhX

  6. 【ABAP系列】SAP VA01屏幕增强(user-exit)

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[MM系列]SAP VA01屏幕增强(user- ...

  7. LeetCode——141 设计链表

    题目: 简单说下思路: 用两个指针,一个跑得快,一个跑得慢(例如一个每次前进两步,一个前进一步),这样只要快指针不会撞上NULL(如果遇到了NULL的情况那么必然不存在环),快指针肯定会和慢指针碰面( ...

  8. python基础-8迭代器(iter)和生成器(yield)

    一 生成器 从Python2.2起,生成器提供了一种简洁的方式帮助返回列表元素的函数来完成简单和有效的代码. 它基于yield指令,允许停止函数并立即返回结果.此函数保存其执行上下文,如果需要,可立即 ...

  9. C++学习笔记(五)--指针、NULL、引用

    1. C++中已经定义了NULL为0:#define NULL 0 指针p可以指向空值NULL即 p = NULL;表示该指针变量不指向任何变量. 注意:指针未初始化与指针为NULL不同, p = N ...

  10. Flask搭建简单的get请求

    用virtualenv venv搭建python虚拟环境.然后执行. #!/usr/bin/env pythonfrom flask import Flask, render_template, re ...