配置 output 选项可以控制 webpack 如何向硬盘写入编译文件。注意,即使可以存在多个入口起点,但只指定一个输出配置。

1. 用法

在 webpack 中配置 output 属性的最低要求是,将它的值设置为一个对象,包括以下两点:

  • filename 用于输出文件的文件名  (A filename to use for the output file(s))。
  • 目标输出目录 path 的绝对路径 (An absolute path to your preferred output directory)。

配置如下:

2. Multiple Entry Points

如果配置创建了多个单独的 "chunk"(例如,使用多个入口起点或使用像 CommonsChunkPlugin 这样的插件),则应该使用占位符(substitutions)来确保每个文件具有唯一的名称。

3. Advanced(进阶)

Here's a more complicated example of using a CDN and hashes for assets:

在编译时不知道最终输出文件的 publicPath 的情况下,publicPath 可以留空,并且在入口起点文件运行时动态设置。如果你在编译时不知道 publicPath,你可以先忽略它,并且在入口起点设置 __webpack_public_path__

webpack学习之——Output的更多相关文章

  1. webpack学习三——output

    output的两个参数filename,path 一.path输出路径,输出路径要绝对路径,否则报错.做法如下: path:__dirname + 'path' 二.filename 输出文件命,相对 ...

  2. 【原】webpack学习笔记

    之前在react的项目中有用过webpack,不过没有认真的去研究,这段时间又重新好好的学习一下webpack,发觉 webpack是一个很强大的东西.而且很好用,方便,接下来主要是做一下学习的笔记 ...

  3. webpack学习(入门基础)

    webpack的学习webpack是什么?1:加载模块(将JS.sass/less.图片等作为模块来处理使用) 2:进行打包 webpack的优势?1:webpack以commonJS(JS的规范)的 ...

  4. webpack学习笔记(二)-- 初学者常见问题及解决方法

    这篇文章是webpack学习第二篇,主要罗列了本人在实际操作中遇到的一些问题及其解决方法,仅供参考,欢迎提出不同意见. 注:本文假设读者已有webpack方面相关知识,故文中涉及到的专有名词不做另外解 ...

  5. webpack学习笔记一:安装webpack、webpack-dev-server、内存加载js和html文件、loader处理非js文件

    一 .webpack学习环境准备: 1:window系统 2:安装node.js  官方网址 下载好后下一步下一步安装即可 安装步骤略过....... 3:nrm的安装 打开cmd命令控制台 输入:n ...

  6. webpack学习(五)—webpack+react+es6(第1篇)

    如果你看过webpack学习系列的前一个文章,接下来做的东西会比较简单 :webpack学习(四)— webpack-dev-server react发展的很快,现在大部分开发react相关的项目,都 ...

  7. 前端小白webpack学习(二)

    前一篇写了自我总结的webpack定义:为JavaScript服务的静态模块打包器 和几大基本概念 entry.output.plugins.loaders等.指路前端小白webpack学习(一) 下 ...

  8. 前端小白webpack学习(一)

    俗话说得好,好记性不如烂笔头. 之前就在学习中看过webpack的教程,然而一段时间没用,火速的忘光了.写这篇博文,做个总结,也让自己以后有个地方回顾. 看webpack之前,我先去看了一下官方文档, ...

  9. Webpack学习-Plugin

    原文地址:http://wushaobin.top/2019/03/15/webpackPlugin/ 什么是Plugin? 在Webpack学习-工作原理(上)一文中我们就已经介绍了Plugin的基 ...

随机推荐

  1. wpf中在style的template寻找ControlTemplate和DataTemplate的控件

    一.WPF中的两棵树 WPF中每个控件的Template都是由ControlTemplate构成,ControlTemplate包含了构成该控件的各种子控件,这些子控件就构成了VisualTree:而 ...

  2. Sqoop学习笔记_Sqoop的基本使用二(sqoop的import与export)

    Sqoop抽取从mysql抽取到hive sqoop抽取到mysql一样有两种方式一种是用command line的方式,一种是用sqoop opt文件调用的方式.(由于两种sqoop一已经记录了,现 ...

  3. Install- Linux必学的60个命令

    1.作用 install命令的作用是安装或升级软件或备份数据,它的使用权限是所有用户. 2.格式 (1)install [选项]... 来源 目的地 (2)install [选项]... 来源... ...

  4. Nmap扫描原理(下)

    转自:https://blog.csdn.net/qq_34398519/article/details/89055999 3     Nmap高级用法 3.1    防火墙/IDS规避 防火墙与ID ...

  5. c++设计模式:观察者模式

    主要思想:建立一个一对多的关系,当一个对象发生发生变化时,其他对象也发生变化. 可以举个博客订阅的例子,当博主发表新文章的时候,即博主状态发生了改 变,那些订阅的读者就会收到通知,然后进行相应的动作, ...

  6. 如何设置td中溢出内容的隐藏显示

    <style type="text/css"> table { table-layout:fixed; } td { overflow:hidden; word-bre ...

  7. SQL server插入数据后,获取自增长字段的值

      ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 insert into Tb_People(uname,er ...

  8. 基于阿里云安装脚本扩展 之 自动安装mongodb及php扩展

    好久没有发布文章了,有点跟不上当初这个博客的初衷.为了使自己的博客更新不半途而废,今天特意再写了一个自动安装脚本,一样是基于阿里云的服务端安装脚本进行的扩展.闲话不说,直接放代码: #!/bin/ba ...

  9. 原 ASP.net out 和ref之间的区别

    ref和out都是C#中的关键字,所实现的功能也差不多,都是指定一个参数按照引用传递.对于编译后的程序而言,它们之间没有任何区别,也就是说它们只有语法区别.总结起来,他们有如下语法区别: 1.ref传 ...

  10. 处理iphone的 .play() 不能播放问题

    一.添加音乐 <audio id="Jaudio" src="shake.mp3" preload loop="loop" contr ...