From 4f0d05782a4584380c25a019e984f0192d3cfacf Mon Sep 17 00:00:00 2001 From: Simon Ser Date: Tue, 14 Jan 2025 12:16:16 +0100 Subject: [PATCH 1/4] ui-core: add missing dependency on @osrd-project/ui-icons Signed-off-by: Simon Ser --- package-lock.json | 1 + ui-core/package.json | 1 + 2 files changed, 2 insertions(+) diff --git a/package-lock.json b/package-lock.json index 54e7b734d..cd91b2d40 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17923,6 +17923,7 @@ "version": "0.0.1-dev", "license": "LGPL-3.0-or-later", "dependencies": { + "@osrd-project/ui-icons": "0.0.1-dev", "classnames": "^2.5.1", "tailwindcss": "^3.4.1" }, diff --git a/ui-core/package.json b/ui-core/package.json index 833c57cee..8fdadbe7f 100644 --- a/ui-core/package.json +++ b/ui-core/package.json @@ -40,6 +40,7 @@ "react": ">=18.0" }, "dependencies": { + "@osrd-project/ui-icons": "0.0.1-dev", "classnames": "^2.5.1", "tailwindcss": "^3.4.1" }, From d7fcc8338c56b29c264cf3d161c78195681e3d3d Mon Sep 17 00:00:00 2001 From: Simon Ser Date: Tue, 14 Jan 2025 12:17:44 +0100 Subject: [PATCH 2/4] build: fix unresolved dependencies We don't want to include our dependencies (react, maplibre, and so on) in the final bundle: because library users download these as transitive deps we want to leave it up to them to resolve the imports and include them in the final app bundle. For instance, OSRD is responsible for inlining maplibre imports in ui-warped-map's bundle. On the other hand, relative imports local to the package should be bundled. By default, rollup only resolves relative imports, and doesn't resolve global imports. rollup prints an error when it encounters a global import that it can't resolve. We don't want to just ignore unresolved global imports, because that would silently allow broken non-existing imports. The @rollup/plugin-node-resolve plugin allows rollup to resolve global imports like node does. However, by default it includes all global imports in the bundle. This isn't what we want: we want to exclude dependencies from the bundle. To fix this, follow the recommendations in the rollup docs [1] and use the "external" option to check whether an import points to the "node_modules" directory or a "dist" directory of any osrd-ui package. In that case, ask rollup to not bundle the import. We don't need to manually specify a list of external imports from each package anymore. [1]: https://rollupjs.org/configuration-options/#external Signed-off-by: Simon Ser --- package-lock.json | 50 +++++++++++++++++++ package.json | 1 + rollup-base.config.js | 13 ++++- ui-core/rollup.config.js | 3 +- .../rollup.config.js | 3 +- ui-manchette/rollup.config.js | 3 +- ui-spacetimechart/rollup.config.js | 2 +- ui-speedspacechart/rollup.config.js | 2 +- ui-trackoccupancydiagram/rollup.config.js | 2 +- 9 files changed, 71 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index cd91b2d40..940bc58b4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,6 +20,7 @@ ], "devDependencies": { "@rollup/plugin-eslint": "^9.0.5", + "@rollup/plugin-node-resolve": "^16.0.0", "@rollup/plugin-terser": "^0.4.4", "@rollup/plugin-typescript": "^12.1.0", "@types/lodash": "^4.17.13", @@ -3034,6 +3035,38 @@ } } }, + "node_modules/@rollup/plugin-node-resolve": { + "version": "16.0.0", + "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-16.0.0.tgz", + "integrity": "sha512-0FPvAeVUT/zdWoO0jnb/V5BlBsUSNfkIOtFHzMO4H9MOklrmQFY6FduVHKucNb/aTFxvnGhj4MNj/T1oNdDfNg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@rollup/pluginutils": "^5.0.1", + "@types/resolve": "1.20.2", + "deepmerge": "^4.2.2", + "is-module": "^1.0.0", + "resolve": "^1.22.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "rollup": "^2.78.0||^3.0.0||^4.0.0" + }, + "peerDependenciesMeta": { + "rollup": { + "optional": true + } + } + }, + "node_modules/@rollup/plugin-node-resolve/node_modules/@types/resolve": { + "version": "1.20.2", + "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.2.tgz", + "integrity": "sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==", + "dev": true, + "license": "MIT" + }, "node_modules/@rollup/plugin-terser": { "version": "0.4.4", "dev": true, @@ -7472,6 +7505,16 @@ "dev": true, "license": "MIT" }, + "node_modules/deepmerge": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", + "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/defaults": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.4.tgz", @@ -10176,6 +10219,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-module": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/is-module/-/is-module-1.0.0.tgz", + "integrity": "sha512-51ypPSPCoTEIN9dy5Oy+h4pShgJmPCygKfyRCISBI+JoWT/2oJvK8QPxmwv7b/p239jXrm9M1mlQbyKJ5A152g==", + "dev": true, + "license": "MIT" + }, "node_modules/is-number": { "version": "7.0.0", "license": "MIT", diff --git a/package.json b/package.json index 9021ee01d..33b97e41f 100644 --- a/package.json +++ b/package.json @@ -37,6 +37,7 @@ "type": "module", "devDependencies": { "@rollup/plugin-eslint": "^9.0.5", + "@rollup/plugin-node-resolve": "^16.0.0", "@rollup/plugin-terser": "^0.4.4", "@rollup/plugin-typescript": "^12.1.0", "@types/lodash": "^4.17.13", diff --git a/rollup-base.config.js b/rollup-base.config.js index 27d23e635..b8c30bb15 100644 --- a/rollup-base.config.js +++ b/rollup-base.config.js @@ -1,15 +1,18 @@ import process from 'process'; +import path from 'path'; import eslint from '@rollup/plugin-eslint'; +import nodeResolve from '@rollup/plugin-node-resolve'; import terser from '@rollup/plugin-terser'; import typescript from '@rollup/plugin-typescript'; import livereload from 'rollup-plugin-livereload'; import postcss from 'rollup-plugin-postcss'; const formats = ['esm']; +const rootDir = path.join(process.cwd(), '..'); /** @type {import("rollup").RollupOptions} */ -const generateRollupBaseConfig = (projectName, external) => ({ +const generateRollupBaseConfig = (projectName) => ({ input: 'src/index.ts', output: formats.map((format) => ({ file: `dist/index.${format}.js`, @@ -18,6 +21,7 @@ const generateRollupBaseConfig = (projectName, external) => ({ sourcemap: true, })), plugins: [ + nodeResolve({ rootDir }), eslint(), typescript(), postcss({ @@ -31,7 +35,12 @@ const generateRollupBaseConfig = (projectName, external) => ({ watch: 'dist', }), ], - external, + external: (id, parent, isResolved) => { + if (!isResolved) return false; + const rel = path.relative(rootDir, id); + const filenames = rel.split(path.sep); + return filenames[0] === 'node_modules' || filenames[1] === 'dist'; + }, }); export default generateRollupBaseConfig; diff --git a/ui-core/rollup.config.js b/ui-core/rollup.config.js index bdea62d94..42434f81b 100644 --- a/ui-core/rollup.config.js +++ b/ui-core/rollup.config.js @@ -1,2 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore', ['react']); + +export default generateBaseRollupConfig('osrdcore'); diff --git a/ui-manchette-with-spacetimechart/rollup.config.js b/ui-manchette-with-spacetimechart/rollup.config.js index bdea62d94..42434f81b 100644 --- a/ui-manchette-with-spacetimechart/rollup.config.js +++ b/ui-manchette-with-spacetimechart/rollup.config.js @@ -1,2 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore', ['react']); + +export default generateBaseRollupConfig('osrdcore'); diff --git a/ui-manchette/rollup.config.js b/ui-manchette/rollup.config.js index bdea62d94..42434f81b 100644 --- a/ui-manchette/rollup.config.js +++ b/ui-manchette/rollup.config.js @@ -1,2 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore', ['react']); + +export default generateBaseRollupConfig('osrdcore'); diff --git a/ui-spacetimechart/rollup.config.js b/ui-spacetimechart/rollup.config.js index b38934f28..42434f81b 100644 --- a/ui-spacetimechart/rollup.config.js +++ b/ui-spacetimechart/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore', ['react']); +export default generateBaseRollupConfig('osrdcore'); diff --git a/ui-speedspacechart/rollup.config.js b/ui-speedspacechart/rollup.config.js index b38934f28..42434f81b 100644 --- a/ui-speedspacechart/rollup.config.js +++ b/ui-speedspacechart/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore', ['react']); +export default generateBaseRollupConfig('osrdcore'); diff --git a/ui-trackoccupancydiagram/rollup.config.js b/ui-trackoccupancydiagram/rollup.config.js index 404286dce..fed152b83 100644 --- a/ui-trackoccupancydiagram/rollup.config.js +++ b/ui-trackoccupancydiagram/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdTrackOccupancyDiagram', ['react']); +export default generateBaseRollupConfig('osrdTrackOccupancyDiagram'); From cb9b76453a9001d6bc4ac096491108e64d298458 Mon Sep 17 00:00:00 2001 From: Simon Ser Date: Tue, 14 Jan 2025 12:57:23 +0100 Subject: [PATCH 3/4] build: automatically infer project name Use the directory name to figure out the current project name. This fixes a bunch of incorrect project names: "osrdcore" was used for packages other than ui-core. Signed-off-by: Simon Ser --- rollup-base.config.js | 5 +++-- ui-core/rollup.config.js | 2 +- ui-manchette-with-spacetimechart/rollup.config.js | 2 +- ui-manchette/rollup.config.js | 2 +- ui-spacetimechart/rollup.config.js | 2 +- ui-speedspacechart/rollup.config.js | 2 +- ui-trackoccupancydiagram/rollup.config.js | 2 +- 7 files changed, 9 insertions(+), 8 deletions(-) diff --git a/rollup-base.config.js b/rollup-base.config.js index b8c30bb15..aea3f13e1 100644 --- a/rollup-base.config.js +++ b/rollup-base.config.js @@ -10,14 +10,15 @@ import postcss from 'rollup-plugin-postcss'; const formats = ['esm']; const rootDir = path.join(process.cwd(), '..'); +const name = path.basename(process.cwd()); /** @type {import("rollup").RollupOptions} */ -const generateRollupBaseConfig = (projectName) => ({ +const generateRollupBaseConfig = () => ({ input: 'src/index.ts', output: formats.map((format) => ({ file: `dist/index.${format}.js`, format, - name: projectName, + name, sourcemap: true, })), plugins: [ diff --git a/ui-core/rollup.config.js b/ui-core/rollup.config.js index 42434f81b..fefa4fb63 100644 --- a/ui-core/rollup.config.js +++ b/ui-core/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore'); +export default generateBaseRollupConfig(); diff --git a/ui-manchette-with-spacetimechart/rollup.config.js b/ui-manchette-with-spacetimechart/rollup.config.js index 42434f81b..fefa4fb63 100644 --- a/ui-manchette-with-spacetimechart/rollup.config.js +++ b/ui-manchette-with-spacetimechart/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore'); +export default generateBaseRollupConfig(); diff --git a/ui-manchette/rollup.config.js b/ui-manchette/rollup.config.js index 42434f81b..fefa4fb63 100644 --- a/ui-manchette/rollup.config.js +++ b/ui-manchette/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore'); +export default generateBaseRollupConfig(); diff --git a/ui-spacetimechart/rollup.config.js b/ui-spacetimechart/rollup.config.js index 42434f81b..fefa4fb63 100644 --- a/ui-spacetimechart/rollup.config.js +++ b/ui-spacetimechart/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore'); +export default generateBaseRollupConfig(); diff --git a/ui-speedspacechart/rollup.config.js b/ui-speedspacechart/rollup.config.js index 42434f81b..fefa4fb63 100644 --- a/ui-speedspacechart/rollup.config.js +++ b/ui-speedspacechart/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdcore'); +export default generateBaseRollupConfig(); diff --git a/ui-trackoccupancydiagram/rollup.config.js b/ui-trackoccupancydiagram/rollup.config.js index fed152b83..fefa4fb63 100644 --- a/ui-trackoccupancydiagram/rollup.config.js +++ b/ui-trackoccupancydiagram/rollup.config.js @@ -1,3 +1,3 @@ import generateBaseRollupConfig from '../rollup-base.config.js'; -export default generateBaseRollupConfig('osrdTrackOccupancyDiagram'); +export default generateBaseRollupConfig(); From 3220188705637e748515314217ac6a9d8f5fb48d Mon Sep 17 00:00:00 2001 From: Simon Ser Date: Tue, 14 Jan 2025 12:59:22 +0100 Subject: [PATCH 4/4] ui-warped-map: use centralized rollup config Instead of hand-rolling our own rollup configuration, use the defaults. Fixes unresolved import errors. Signed-off-by: Simon Ser --- ui-warped-map/rollup.config.js | 19 ++----------------- 1 file changed, 2 insertions(+), 17 deletions(-) diff --git a/ui-warped-map/rollup.config.js b/ui-warped-map/rollup.config.js index ee5750f7b..fefa4fb63 100644 --- a/ui-warped-map/rollup.config.js +++ b/ui-warped-map/rollup.config.js @@ -1,18 +1,3 @@ -import typescript from '@rollup/plugin-typescript'; -import terser from '@rollup/plugin-terser'; -import eslint from '@rollup/plugin-eslint'; +import generateBaseRollupConfig from '../rollup-base.config.js'; -const formats = ['esm']; - -/** @type {import('rollup').RollupOptions} */ -export default { - input: 'src/index.ts', - output: formats.map((format) => ({ - file: `dist/index.${format}.js`, - format, - name: 'osrdwarpedmap', - sourcemap: true, - })), - plugins: [eslint(), typescript(), terser()], - external: ['react'], -}; +export default generateBaseRollupConfig();