首页 » 前端开发 » 正文

Webpack命令行界面(CLI)文档【译文】

写在前面

为了方便后期查阅资料,所以打算直接把官方文档翻译一遍放在此处,官方文档请参考附录一。限本人英语翻译水平有限,如果有觉得翻译不恰当的甚至有翻译错误的,欢迎留言指正,谢谢。

此篇文章的最后翻译时间是2016.08.21。

同时已经翻译的的其他两篇分别是

下面开始正文。

安装

npm install webpack -g

现在webpack命令已经全局可用了。

纯命令行

webpack <entry> <output>

entry

传一个文件或者请求的字符串。你可以传多个项(每项都会在启动时加载)。

如果你传入的是<name>=<request>的形式的组合,你可以创建一个额外的入口点。

它将会映射到entry配置项中。

output

传入生成文件的路径。

它将会映射到output.pathoutput.filename配置项中。

配置项

许多配置项都会从命令行选项中映射出来。比如--debug映射成debug:true,或--output-library-target映射成 output.libraryTarget

如果你(在命令行中)不传入任何参数将显示所有的选项。(译注:在有比如webpack.config.js的配置文件的目录下,执行webpack命令将进行打包操作,否则将显示所有选项)。

插件

一些插件被映射到命令行选项。也就是说--define <string>=<string>映射到DefinePlugin中。

开发模式简写 -d

--debug --devtool source-map --output-pathinfo等价

生产模式简写 -p

--optimize-minimize --optimize-occurence-order等价

监听模式 --watch

监听所有的依赖和修改后的重新编译

配置文件 --config example.config.js

如果你需要有一个不同于默认值(webpack.config.js)的配置文件名字,使用这种方式指定一个配置文件。

显示选项

--progress

显示一个到stderr的编译过程

--json

写JSON到stdout中,而不是一种人类可读的格式

提示:可以将结果上传到 分析工具

--no-color

显示数据时不显示颜色

--sort-modules-by, --sort-chunks-by, --sort-assets-by

按照 modules/chunks/assets列排序

--display-chunks

显示模块分离成块

--display-reasons

显示关于为什么一个模块被包含的更多信息。

--display-error-details

显示关于错误的更多信息。也就是说,当解析模块时,这会显示哪些路径被尝试过。

--display-modules

显示隐藏的模块。如果模块在[“node_modules”, “bower_components”, “jam”, “components”]这些目录中,他们默认不会从输出中显示出来。

--display-exclude

排除输出中的模块。

性能分析

如果你期望了解到各项花费的时间,你可以使用--profile开关。这会让WebPack显示更多的详细的时间信息。使用这个开关来获取到一个非常详细的消息和信息集,其中包括你的模块耗时。下面列出了打印时的关键字及其含义。

耗时关键字

  • factory: 构建模块信息所花费的时间信息
  • building:构建模块过程(比如加载器)花费的时间
  • dependencies:收集和连接依赖花费的时间

额外的配置选项

当使用命令行时有机会能够在配置文件中使用以下选项。他们能够在使用node.js API时通过其他方式传递。

watch

进入监听模式,即文件变更时重新构建。

watchOptions.aggregateTimeout

在第一次变更之后延时多少毫秒之后再重新构建。默认值是300。

watchOptions.poll

true: 使用轮询

number: 在特定的间隔上使用轮询

默认值是undefined

stats

显示选项。查阅 node.js API Stats.toString()来获得更详细信息。

附录

本文共 2 个回复

发表评论