如果你写过前端代码，可能下面的话听起来会熟悉:

Ryan 乐于书写顶级前端 (也许是用React 或 Vue.js!)。但首先，他要安装 Webpack... 并配置 loaders。Ryan 明确要用到SASS，因此他还要配置 sass-loader 并且要配置 ExtractTextWebpackPlugin 来输出CSS文件。哦，可别忘了输出source maps呀！在生产环境下，所有东西都被最小化了吗？喔，又是大量的配置！

对每个遇到过此种障碍的人，我现在 极度 兴奋地向你们展示一些东西，我们已经为此工作了数月之久: Webpack Encore。

Encore为你提供强有力的CSS和JavaScript处理、合并、最小化以及其他更多，被打包进一个简单API，基于行业标准级别的工具 (Webpack) 而构建。书写一些富于表达的JavaScript，剩下的交给Webpack来做:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

// webpack.config.js
var Encore = require('@symfony/webpack-encore');
 
Encore
    .setOutputPath('web/build/')
    .setPublicPath('/build')
 
    // 读取 main.js     -> 输出的是 web/build/app.js
    .addEntry('app', './assets/js/main.js')
    // 读取 global.scss -> 输出的是 as web/build/global.css
    .addStyleEntry('global', './assets/css/global.scss')
 
    // enable features! / 开启功能！
    .enableSassLoader()
    .autoProvidejQuery()
    .enableReactPreset()
    .enableSourceMaps(!Encore.isProduction())
    .enableVersioning() // hashed filenames (e.g. main.abc123.js)
                        // 加密的文件名 (如 main.abc123.js)
;
 
module.exports = Encore.getWebpackConfig();

Encore 受到 Webpacker 和 Mix 的启发，但却以Webpack为灵魂: 以一种熟悉的感觉来使用它的功能、概念和命名约定。它瞄准的是去解决最为常用的Webpack用例。它可以 极好地 同Symfony一起使用，但也可以用在由任何语言编写的任何程序中。

你可以在今天立即使用Encore: Webpack Encore Docs! 它尚未发布稳定的1.0版，但是 CHANGELOG 将随着每一个新版本而更新。感觉功能有遗漏或发现bug? 在GitHub上帮着把这个社区项目推向前进 symfony/webpack-encore。

为何选用Webpack Encore？

当你使用Symfony时，我们希望自始至终都能简单地利用上 最好的 工具。 这就是为什么对于assets来说，Symfony 2.0自带了Assetic: 一个纯PHP类库。在2011年，这十分有意义。可在2017年，世道变了。

现在，用于处理assets的工具之 最佳实践 是用 Node.js 写的。而 Webpack 无疑是领导者。由我们希望推荐高质量工具，我们就推荐了Webpack。

只剩一个问题：配置Webpack不简单。因此Encore才诞生: 作为一个 thin tool（紧凑型工具），可以帮助最佳类库 (Webpack) 普及给世人。Encore生成的是标准的 webpack.config.js 文件，使用的是原生的Webpack功能，并且持续保持着其语言和概念。不同于创建 "另一个类库"，我们推荐投向Webpack。

使用Encore，来让前端的配置变得强力，但却人人可用。

感谢社区成员 stof, javiereguiluz, tucksaun, lyrixx 和那些帮助我们审阅和加速Encore原始版本的人们。

Symfony中的Encore

尽管Encore可以在任何项目中工作得很好，它在Symfony中工作得更是好上加好，多亏了 JSON manifest strategy（基于清单的资源版本 ），这是Symfony 3.3的新功能。通过添加 config.yml中的一个新行，你可以添加版本并配置Encore中的一个CDN 而毋须改变你程序中的任何内容。