reactjs - 用于生产的 Preact 和 Webpack

Question

只是想确保我的 preact js 设置正确以适合生产。

在我使用 preact 进行 webpack 设置并运行 npm run build 时，我注意到 Bundle Analyzer 插件的 preact js 文件的路径是

/node_modules/preact/dist/preact.js 而不是

/node_modules/preact/dist/preact.min.js

我也设置了 uglify 和 minify js，但只是觉得奇怪的是，缩小的包没有被拾取？

webpack 中的入口脚本

  entry: { app: './src/index.js', vendor: [ 'preact', 'preact-router' ] },

Npm 运行构建脚本

   "build": "cross-env NODE_ENV=production webpack --progress -p --display-modules --display-chunks"

Answer 1

preact 的默认 main 是 dist/preact.js - preact.min.js 适合那些想要利用的人不应用自己的压缩方法(例如，人们将其从 CDN 上热链接)，并测量现实世界的输出大小。

您已经通过使用 -p 标志运行 webpack 将 UglifyJS 应用到您的包中，因此您不必太担心尝试使用 dist/preact.min.js。它可以节省一些字节，但没什么大不了的。您正在使用的文件 (dist/preact.js) 实际上已经通过 Preact 的 UglifyJS 运行，它只是未压缩但未损坏(因此变量名称保持不变)。