output 属性告诉 webpack 在哪里输出它所创建的 bundles,以及如何命名这些文件,默认值为 ./dist。基本上,整个应用程序结构,都会被编译到你指定的输出路径的文件夹中。你可以通过在配置中指定一个 output 字段,来配置这些处理过程:
`webpack.config.js`
~~~
const path = require('path');
module.exports = {
entry: './path/to/my/entry/file.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'my-first-webpack.bundle.js'
}
};
~~~
我们通过 output.filename 和 output.path 属性,来告诉 webpack bundle 的名称,以及我们想要 bundle 生成(emit)到哪里。可能你想要了解在代码最上面导入的 path 模块是什么,它是一个 Node.js 核心模块,用于操作文件路径。
配置 output 选项可以控制 webpack 如何向硬盘写入编译文件。注意,即使可以存在多个入口起点,但只指定一个输出配置。
在 webpack 中配置 output 属性的最低要求是,将它的值设置为一个对象,包括以下两点:
* filename 用于输出文件的文件名。
* 目标输出目录 path 的绝对路径。
- js
- js继承
- keyCode
- 好的网站
- 零散知识点-js
- This
- 对象深拷贝和浅拷贝
- 数组方法
- 数组的深拷贝和浅拷贝
- JS 引擎的执行机制
- js中的new
- 常用正则
- 函数柯里化
- 会修改当前数组的方法
- 不会修改当前数组的方法
- 函数式编程
- 循环遍历
- 基础知识
- 异步
- js知识总结
- fileReader
- HTML
- 零散知识点
- html5新特性
- viewport
- CSS
- cursor
- css3新特性
- 水平居中
- 垂直居中
- display解析
- 块级元素和行内元素
- css技巧和方法
- 清除浮动
- Less
- Sass
- 综合
- 微信小程序
- 前端面试
- CSS-面试
- JS-面试
- js-web-api
- js知识
- MVC-面试
- jQuery与框架的区别
- 闭包
- promise
- http状态码
- cdn
- 离线存储
- 事件
- web安全
- 性能优化
- 响应式
- 服务器渲染和本地渲染
- 模板是什么?
- VUE流程
- 浏览器渲染过程
- this的指向
- new的使用
- HTML-面试
- title和alt区别
- html5元素
- h5新特性
- 图片格式
- 零散面试总结
- react
- 生命周期-react
- state
- props
- 组件通信
- 虚拟DOM
- 源码分析
- webstorm-template
- element与component区别
- 组件的理解
- JXS
- vue与react区别
- 16.8版本
- vue
- 生命周期-vue
- 实现流程
- webpack
- 概念
- 入口起点
- 出口
- loader
- 模式
- 插件
- manifest
- redux
- 介绍
- 核心概念
- 三大原则
- 基础
- action
- reducer
- store
- 数据流
- 高级
- 异步action
- 异步数据流
- middleware
- ES6阮一峰
- ...
- let
- es6箭头函数
- const
- 块级作用域
- 顶层对象的属性
- global 对象
- 变量的解构赋值
- 字符串的扩展
- promise对象
- 正则的扩展
- 数值的扩展
- Math对象的扩展
- 函数的扩展
- 数组的扩展
- 对象的扩展
- symbol
- async函数
- class的基本用法
- Class 的继承
- Set 和 Map 数据结构
- 开发工具
- 好用的软件
- chrome插件
- 其他实用工具
- 微信公众号-前端早读课
- 【第1352期】map和reduce,处理数据结构的利器
- 微信公众号-前端大全
- JS 的执行机制
- 一篇文章理解 JS 继承
- 浏览器
- 缓存
- 《Webkit技术内幕》之页面渲染过程
- 跨域
- 安全
- XSS
- 设计模式
- 发布订阅模式
- 工厂模式
- MV*模式
- 观察者模式
- react-router
- 一些小技巧
- js一些小算法
- 1.已知一个数组中的值,在另外一个数组中查找该值
- 累加器
- 数组随机
- 数组扁平化并去重排序
- Immutable
- 常用命令
- hybrid
- schema封装
- typescript