arui-scripts 12.0.3 → 12.2.0

package/CHANGELOG.md

@@ -1,6 +1,6 @@
-## [12.0.3](https://github.com/alfa-laboratory/arui-scripts/compare/v12.0.2...v12.0.3) (2021-11-29)
+# [12.2.0](https://github.com/alfa-laboratory/arui-scripts/compare/v12.1.0...v12.2.0) (2022-02-17)
 
 
-### Bug Fixes
+### Features
 
-* **webpack-dev:** disable default override of NODE_ENV ([49b1464](https://github.com/alfa-laboratory/arui-scripts/commit/49b1464d2574514374aec223c5fde3fed025c93a))
+* **webpack-client:** add stats file generation ([f6301da](https://github.com/alfa-laboratory/arui-scripts/commit/f6301da5ebf6f7975a1b810c904cafd9c1d3f8f8))

package/README.md

@@ -68,6 +68,7 @@ npm install arui-scripts --save-dev
 - `archiveName` - имя архива, который будет создан при использовании команды `archive-build`. По умолчанию `build.tar`.
 - `keepPropTypes` - если `true`, пакеты с prop-types не будут удалены из production билда.
 - `debug` - режим отладки, в котором не выполняются некоторые нежелательные операции и выводится больше сообщений об ошибках, по умолчанию `false`.
+- `statsOutputFilename` - имя [stats-файла](https://webpack.js.org/api/stats/), которое будет использоваться в [bundle-analyze](#анализ-бандла) команде
 - `useTscLoader` -  использовать ts-loader вместо babel-loader для обработки ts файлов. У babel-loader есть [ряд ограничений](https://blogs.msdn.microsoft.com/typescript/2018/08/27/typescript-and-babel-7/). По умолчанию `false`.
 - `componentsTheme` - путь к css файлу с темой для [core-components](https://alfa-laboratory.github.io/core-components). Используется для настройки [postcss-custom-properties](https://github.com/postcss/postcss-custom-properties#importfrom).
 - `keepCssVars` - отключает `postcss-custom-properties`, css переменные будут оставаться в бандле.
@@ -426,7 +427,16 @@ require node.js на таких местах ломается. Поэтому н
 воспользоваться механизмом `overrides`, описанным ниже.
 По умолчанию же все не-js файлы из внешних модулей будут проигнорированы.
 
-
+Анализ бандла
+---
+Для изучения итогового бандла приложения и просмотра его размеров и включенных файлов в arui-scripts есть команда
+```
+arui-scripts bundle-analyze
+```
+Она запускает [webpack-bundle-analyzer](https://www.npmjs.com/package/webpack-bundle-analyzer) для клиентского кода.
+Так же при запуске будет генерироваться [stats-файл](https://webpack.js.org/api/stats/), который можно использовать в
+[сторонних](http://webpack.github.io/analyse/) инструментах, например для понимания почему тот или иной модуль попал в бандл.
+По умолчанию файл будет писаться в `.build/stats.json`.
 
 Тонкая настройка
 ===

package/build/commands/bundle-analyze/index.js

@@ -16,10 +16,15 @@ const webpack_1 = __importDefault(require("webpack"));
 const webpack_bundle_analyzer_1 = require("webpack-bundle-analyzer");
 const make_tmp_dir_1 = __importDefault(require("../util/make-tmp-dir"));
 const webpack_client_prod_1 = __importDefault(require("../../configs/webpack.client.prod"));
+const app_configs_1 = __importDefault(require("../../configs/app-configs"));
 (() => __awaiter(void 0, void 0, void 0, function* () {
     var _a;
     const tmpDir = yield make_tmp_dir_1.default();
-    (_a = webpack_client_prod_1.default === null || webpack_client_prod_1.default === void 0 ? void 0 : webpack_client_prod_1.default.plugins) === null || _a === void 0 ? void 0 : _a.push((new webpack_bundle_analyzer_1.BundleAnalyzerPlugin()));
+    const plugin = new webpack_bundle_analyzer_1.BundleAnalyzerPlugin({
+        generateStatsFile: true,
+        statsFilename: app_configs_1.default.statsOutputPath,
+    });
+    (_a = webpack_client_prod_1.default.plugins) === null || _a === void 0 ? void 0 : _a.push(plugin);
     webpack_client_prod_1.default.output.path = tmpDir;
     webpack_1.default(webpack_client_prod_1.default).run(() => { });
 }))();

package/build/configs/app-configs/available-package-settings.js

@@ -23,6 +23,7 @@ exports.availablePackageSettings = [
     'clientServerPort',
     'serverPort',
     'debug',
+    'statsOutputFilename',
     'componentsTheme',
     'keepCssVars',
 ];

package/build/configs/app-configs/calculate-dependent-config.js

@@ -16,6 +16,7 @@ function calculateDependentConfig(config) {
         serverOutputPath: path_1.default.resolve(config.cwd, config.buildPath),
         clientOutputPath: path_1.default.resolve(config.cwd, config.buildPath, config.assetsPath),
         clientPolyfillsEntry: get_polyfills_1.getPolyfills(config),
+        statsOutputPath: path_1.default.resolve(config.cwd, config.buildPath, config.statsOutputFilename),
     });
 }
 exports.calculateDependentConfig = calculateDependentConfig;

package/build/configs/app-configs/get-defaults.js

@@ -53,12 +53,14 @@ function getDefaults() {
         serverPort: 3000,
         debug: false,
         overridesPath: [overridesPath],
+        statsOutputFilename: 'stats.json',
         componentsTheme: undefined,
         keepCssVars: false,
         // Эти пути зависят от других настроек, которые могут быть переопределены пользователем
         publicPath: '',
         serverOutputPath: '',
         clientOutputPath: '',
+        statsOutputPath: '',
     };
 }
 exports.getDefaults = getDefaults;