AG-36016 Improve builds for CSS Tokenizer and AGTree

Merge in ADGUARD-FILTERS/tsurlfilter from fix/AG-36016 to master Squashed commit of the following: commit b063007 Merge: bc00457 f13c5a0 Author: scripthunter7 <[email protected]> Date: Wed Sep 18 15:24:39 2024 +0200 Merge branch 'master' into fix/AG-36016 commit bc00457 Author: scripthunter7 <[email protected]> Date: Wed Sep 18 10:47:00 2024 +0200 bump date commit 5dae2da Author: scripthunter7 <[email protected]> Date: Wed Sep 18 10:22:11 2024 +0200 change dts to types commit eab9f6e Author: scripthunter7 <[email protected]> Date: Tue Sep 17 17:31:49 2024 +0200 throw error instead commit 87a6431 Author: scripthunter7 <[email protected]> Date: Tue Sep 17 17:11:54 2024 +0200 refactor plugin extractor commit 8d9b495 Author: scripthunter7 <[email protected]> Date: Tue Sep 17 16:50:52 2024 +0200 optimize build for agtree commit c00a8fb Author: scripthunter7 <[email protected]> Date: Tue Sep 17 16:50:05 2024 +0200 optimize build for css tokenizer
AdguardTeam · Sep 18, 2024 · 0a3e95b · 0a3e95b
1 parent f13c5a0
commit 0a3e95b
Show file tree

Hide file tree

Showing 10 changed files with 212 additions and 1,318 deletions.
diff --git a/packages/agtree/benchmark/config/tools.ts b/packages/agtree/benchmark/config/tools.ts
@@ -7,7 +7,7 @@ import * as TsUrlFilterV2 from 'tsurlfilter-v2';
 import * as AGTreeV1 from 'agtree-v1';
 
 // eslint-disable-next-line import/no-relative-packages, import/extensions
-import * as AGTreeV2 from '../../dist/agtree.cjs';
+import * as AGTreeV2 from '../../dist/agtree.js';
 import { type ToolConfigs } from '../common/interfaces';
 import { RE_NL_SPLIT } from '../common/constants';
 

diff --git a/packages/agtree/browser-benchmark/helpers/build-agtree-node.ts b/packages/agtree/browser-benchmark/helpers/build-agtree-node.ts
@@ -5,12 +5,11 @@
  */
 import { rollup } from 'rollup';
 import path from 'path';
-import { fileURLToPath } from 'url';
+import nodeResolve from '@rollup/plugin-node-resolve';
+import swc from '@rollup/plugin-swc';
 
-import { getNodePlugins } from '../../rollup.config';
-
-// eslint-disable-next-line @typescript-eslint/naming-convention, no-underscore-dangle
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
+import { commonPlugins } from '../../rollup.config';
+import { extractRollupPlugins } from './extract-rollup-plugins';
 
 /**
  * Create an AGTree bundle for Node.js environment.
@@ -21,8 +20,16 @@ const __dirname = path.dirname(fileURLToPath(import.meta.url));
  */
 export const buildAgTreeForNode = async (): Promise<string> => {
     const bundle = await rollup({
-        input: path.join(__dirname, '..', '..', 'src', 'index.ts'),
-        plugins: getNodePlugins(true),
+        input: path.join(__dirname, '../../src/index.ts'),
+        plugins: [
+            ...extractRollupPlugins(commonPlugins, ['json', 'alias', 'commonjs', 'node-externals']),
+
+            nodeResolve({
+                extensions: ['.js', '.ts'],
+            }),
+
+            swc(),
+        ],
     });
 
     const { output } = await bundle.generate({

diff --git a/packages/agtree/browser-benchmark/helpers/build-iife.ts b/packages/agtree/browser-benchmark/helpers/build-iife.ts
@@ -4,8 +4,11 @@
  * @note It uses the main Rollup configuration from the root of the project.
  */
 import { rollup } from 'rollup';
+import swc from '@rollup/plugin-swc';
+import nodeResolve from '@rollup/plugin-node-resolve';
 
 import { commonPlugins } from '../../rollup.config';
+import { extractRollupPlugins } from './extract-rollup-plugins';
 
 /**
  * Create an IIFE bundle for the browser environment.
@@ -20,7 +23,16 @@ import { commonPlugins } from '../../rollup.config';
 export const buildIife = async (input: string, name: string): Promise<string> => {
     const bundle = await rollup({
         input,
-        plugins: commonPlugins,
+        plugins: [
+            ...extractRollupPlugins(commonPlugins, ['json', 'alias', 'commonjs']),
+
+            nodeResolve({
+                extensions: ['.js', '.ts'],
+                browser: true,
+            }),
+
+            swc(),
+        ],
     });
 
     const { output } = await bundle.generate({

diff --git a/packages/agtree/browser-benchmark/helpers/extract-rollup-plugins.ts b/packages/agtree/browser-benchmark/helpers/extract-rollup-plugins.ts
@@ -0,0 +1,28 @@
+import { type Plugin } from 'rollup';
+
+/**
+ * Extract Rollup plugins from a list of plugins by their names.
+ * It extracts the plugins in the order they appear in the list.
+ *
+ * @param plugins The list of plugins.
+ * @param names The names of the plugins to extract.
+ *
+ * @returns The extracted plugins.
+ *
+ * @throws If a plugin with the given name is not found.
+ */
+export const extractRollupPlugins = (plugins: Plugin[], names: string[]): Plugin[] => {
+    const extractedPlugins: Plugin[] = [];
+
+    for (const name of names) {
+        const plugin = plugins.find((p) => p.name === name);
+
+        if (!plugin) {
+            throw new Error(`Plugin "${name}" not found`);
+        }
+
+        extractedPlugins.push(plugin);
+    }
+
+    return extractedPlugins;
+};
diff --git a/packages/agtree/package.json b/packages/agtree/package.json
@@ -37,14 +37,12 @@
         "node": ">=17"
     },
     "scripts": {
-        "build": "pnpm clean && pnpm build-types && pnpm build-txt && pnpm build-compatibility-tables && pnpm build-compatibility-tables-wiki && pnpm rollup --config rollup.config.ts --configPlugin typescript && pnpm clean-types",
+        "build": "pnpm clean && pnpm build-txt && pnpm build-compatibility-tables && pnpm build-compatibility-tables-wiki && pnpm rollup --config rollup.config.ts --configPlugin typescript && rimraf dist/types",
         "build-txt": "tsx scripts/build-txt.ts",
-        "build-types": "tsc --declaration --emitDeclarationOnly --outdir dist/types",
         "build-compatibility-tables": "tsx scripts/build-compatibility-tables.ts",
         "build-compatibility-tables-wiki": "tsx scripts/build-compatibility-tables-wiki.ts",
         "check-types": "tsc --noEmit",
         "clean": "rimraf dist",
-        "clean-types": "rimraf dist/types",
         "coverage": "jest --runInBand --coverage",
         "increment": "pnpm version patch --no-git-tag-version",
         "lint": "pnpm check-types && pnpm lint:ts && pnpm lint:md",
@@ -55,13 +53,11 @@
         "test:smoke": "(cd test/smoke/esm && pnpm test) && (cd test/smoke/cjs && pnpm test) && (cd test/smoke/typescript && pnpm test)"
     },
     "devDependencies": {
-        "@babel/core": "^7.22.5",
-        "@babel/preset-env": "^7.22.5",
         "@rollup/plugin-alias": "^5.0.0",
-        "@rollup/plugin-babel": "^6.0.3",
         "@rollup/plugin-commonjs": "^25.0.2",
         "@rollup/plugin-json": "^6.0.0",
         "@rollup/plugin-node-resolve": "^15.1.0",
+        "@rollup/plugin-swc": "^0.4.0",
         "@rollup/plugin-typescript": "^11.1.2",
         "@swc/core": "^1.7.24",
         "@swc/helpers": "^0.5.3",

diff --git a/packages/agtree/rollup.config.ts b/packages/agtree/rollup.config.ts
@@ -9,11 +9,9 @@ import commonjs from '@rollup/plugin-commonjs';
 import externals from 'rollup-plugin-node-externals';
 import dtsPlugin from 'rollup-plugin-dts';
 import alias from '@rollup/plugin-alias';
-import { getBabelOutputPlugin } from '@rollup/plugin-babel';
 import json from '@rollup/plugin-json';
 import path from 'node:path';
 import { readFileSync } from 'node:fs';
-import { type Plugin } from 'rollup';
 
 // eslint-disable-next-line @typescript-eslint/naming-convention, no-underscore-dangle
 const __dirname = path.dirname(new URL(import.meta.url).pathname);
@@ -52,76 +50,47 @@ const banner = `/*
  * ${pkg.homepage}
  */`;
 
-// Pre-configured TypeScript plugin
-const typeScriptPlugin = typescript({
-    tsconfig: path.join(ROOT_DIR, 'tsconfig.json'),
-    compilerOptions: {
-        // Don't emit declarations, we will do it in a separate command
-        declaration: false,
-    },
-});
-
 // Common plugins for all types of builds
 export const commonPlugins = [
+    json({ preferConst: true }),
     alias({
         entries: [
-            // replace dynamic compatibility table data builder with the pre-built data file
+            // Replace dynamic compatibility table data builder with the pre-built data file
             {
                 find: './compatibility-table-data',
-                replacement: path.resolve(ROOT_DIR, 'dist', 'compatibility-tables.json'),
+                replacement: path.resolve(ROOT_DIR, 'dist/compatibility-tables.json'),
+            },
+            // Add ".js" extension to all imports of the "semver" package, eg "semver/functions/..."
+            // We need this because we import functions from the "semver" package directly,
+            // otherwise it will cause a "circular dependency" warning during the build.
+            // See https://github.com/npm/node-semver/issues/381
+            // Rollup detects "semver" as an external dependency, so it doesn't add the ".js"
+            // extension by default, and we need to do it manually here, otherwise the ESM
+            // build will fail with "Cannot find module" error.
+            {
+                find: /semver\/(.*)(?<!\.js)$/,
+                replacement: 'semver/$1.js',
             },
         ],
     }),
-    json({ preferConst: true }),
     commonjs({ sourceMap: false }),
     resolve({ preferBuiltins: false }),
-    typeScriptPlugin,
-];
-
-/**
- * Plugins for Node.js builds.
- *
- * @param esm Whether to build an ESM module.
- *
- * @returns List of Rollup plugins.
- */
-export const getNodePlugins = (esm = false): Plugin[] => [
-    ...commonPlugins,
-    alias({
-        // Add ".js" extension to all imports of the "semver" package, eg "semver/functions/..."
-        // We need this because we import functions from the "semver" package directly,
-        // otherwise it will cause a "circular dependency" warning during the build.
-        // See https://github.com/npm/node-semver/issues/381
-        // Rollup detects "semver" as an external dependency, so it doesn't add the ".js"
-        // extension by default, and we need to do it manually here, otherwise the ESM
-        // build will fail with "Cannot find module" error.
-        entries: [
-            { find: /^semver\/(.*)(?<!\.js)$/, replacement: 'semver/$1.js' },
-        ],
-    }),
     externals(),
-    // Provide better browser compatibility with Babel
-    getBabelOutputPlugin({
-        presets: [
-            [
-                '@babel/preset-env',
-                {
-                    modules: esm ? false : 'auto',
-                    // at least Node.js 17
-                    targets: {
-                        node: '17',
-                    },
-                },
-            ],
-        ],
-        allowAllFormats: true,
-        compact: false,
+    typescript({
+        tsconfig: path.join(ROOT_DIR, 'tsconfig.json'),
+        compilerOptions: {
+            incremental: true,
+            declaration: true,
+            declarationDir: path.join(ROOT_DIR, 'dist/types'),
+        },
+        include: [path.join(ROOT_DIR, './src/**/*.ts')],
+        exclude: [path.join(ROOT_DIR, './node_modules'), path.join(ROOT_DIR, './test')],
+        outputToFilesystem: true,
     }),
 ];
 
-// CommonJS build configuration
-const cjs = {
-    input: path.join(ROOT_DIR, 'src', 'index.ts'),
+const node = {
+    input: path.join(ROOT_DIR, 'src/index.ts'),
     output: [
         {
             file: path.join(distDir, `${BASE_FILE_NAME}.js`),
@@ -130,28 +99,20 @@ const cjs = {
             sourcemap: false,
             banner,
         },
-    ],
-    plugins: getNodePlugins(),
-};
-
-// ECMAScript build configuration
-const esm = {
-    input: path.join(ROOT_DIR, 'src', 'index.ts'),
-    output: [
         {
             file: path.join(distDir, `${BASE_FILE_NAME}.mjs`),
             format: 'esm',
             sourcemap: false,
             banner,
         },
     ],
-    plugins: getNodePlugins(),
+    plugins: commonPlugins,
 };
 
 // Merge .d.ts files (requires `tsc` to be run first,
 // because it merges .d.ts files from `dist/types` directory)
 const dts = {
-    input: path.join(ROOT_DIR, 'dist', 'types', 'src', 'index.d.ts'),
+    input: path.join(ROOT_DIR, 'dist/types/src/index.d.ts'),
     output: [
         {
             file: path.join(distDir, `${BASE_FILE_NAME}.d.ts`),
@@ -166,4 +127,4 @@ const dts = {
 };
 
 // Export build configs for Rollup
-export default [cjs, esm, dts];
+export default [node, dts];
diff --git a/packages/css-tokenizer/CHANGELOG.md b/packages/css-tokenizer/CHANGELOG.md
@@ -7,6 +7,14 @@ The format is based on [Keep a Changelog][keepachangelog], and this project adhe
 [keepachangelog]: https://keepachangelog.com/en/1.0.0/
 [semver]: https://semver.org/spec/v2.0.0.html
 
+## [1.1.0] - 2024-09-18
+
+### Removed
+
+- Browser builds.
+
+[1.1.0]: https://github.com/AdguardTeam/tsurlfilter/releases/tag/css-tokenizer-v1.1.0
+
 ## [1.0.0] - 2024-08-15
 
 ### Added

diff --git a/packages/css-tokenizer/package.json b/packages/css-tokenizer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@adguard/css-tokenizer",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "CSS / Extended CSS tokenizer",
   "keywords": [
     "css",
@@ -18,30 +18,24 @@
   },
   "homepage": "https://github.com/AdguardTeam/tsurlfilter/tree/master/packages/css-tokenizer#readme",
   "main": "dist/csstokenizer.js",
-  "module": "dist/csstokenizer.esm.mjs",
-  "browser": "dist/csstokenizer.umd.min.js",
+  "module": "dist/csstokenizer.mjs",
   "types": "dist/csstokenizer.d.ts",
   "exports": {
     ".": {
       "types": "./dist/csstokenizer.d.ts",
-      "import": "./dist/csstokenizer.esm.mjs",
+      "import": "./dist/csstokenizer.mjs",
       "require": "./dist/csstokenizer.js"
-    },
-    "./es": "./dist/csstokenizer.esm.mjs",
-    "./iife": "./dist/csstokenizer.iife.min.js",
-    "./umd": "./dist/csstokenizer.umd.min.js"
+    }
   },
   "files": [
     "dist"
   ],
   "scripts": {
-    "build": "pnpm clean && pnpm build-types && pnpm build-txt && pnpm rollup --config rollup.config.ts --configPlugin @rollup/plugin-json --configPlugin @rollup/plugin-typescript && pnpm clean-types",
+    "build": "pnpm clean && pnpm build-txt && pnpm rollup --config rollup.config.ts --configPlugin @rollup/plugin-json --configPlugin @rollup/plugin-typescript && rimraf dist/types",
     "build-txt": "pnpm ts-node scripts/build-txt.ts",
-    "build-types": "tsc --declaration --emitDeclarationOnly --outdir dist/types",
     "benchmark": "pnpm build && node -r esbuild-register benchmark/index.ts",
     "check-types": "tsc --noEmit",
     "clean": "rimraf dist",
-    "clean-types": "rimraf dist/types",
     "coverage": "jest --coverage",
     "increment": "pnpm version patch --no-git-tag-version",
     "lint": "pnpm lint:ts && pnpm lint:md",
@@ -50,12 +44,9 @@
     "test": "jest --runInBand"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.8",
-    "@babel/preset-env": "^7.22.7",
     "@csstools/css-tokenizer": "^2.2.1",
     "@csstools/tokenizer": "^3.1.0",
     "@rollup/plugin-alias": "^5.0.0",
-    "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-json": "^6.0.0",
     "@rollup/plugin-node-resolve": "^15.2.1",
@@ -94,7 +85,6 @@
     "rollup": "^3.29.4",
     "rollup-plugin-dts": "^6.0.2",
     "rollup-plugin-node-externals": "^6.1.1",
-    "rollup-plugin-polyfill-node": "^0.12.0",
     "terser": "^5.21.0",
     "ts-node": "^10.9.1",
     "typescript": "^5.1.6"