Refactor: Refresh the CSS in dev mode#1814
Merged
samuel-duhaime merged 1 commit intochairemobilite:mainfrom Feb 25, 2026
Merged
Refactor: Refresh the CSS in dev mode#1814samuel-duhaime merged 1 commit intochairemobilite:mainfrom
samuel-duhaime merged 1 commit intochairemobilite:mainfrom
Conversation
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughAdded Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/transition-frontend/webpack.config.js`:
- Around line 93-110: The current watchOptions.ignored regex is correct but hard
to read and too permissive for the chaire-lib-frontend exception; extract a
small helper function (e.g., escapeForRegex) to escape filesystem paths used
with path.join(chaireLibFrontendRoot, 'lib', 'styles') and
path.join(transitionFrontendRoot, 'lib', 'styles') to improve readability, and
tighten the negative lookahead for the node_modules exception from
/(?!chaire-lib-frontend)/ to /(?!chaire-lib-frontend[\\/])/ (or equivalent) so
only the exact package name is un-ignored; update references in the ignored
value to use the helper-escaped path fragments and the revised lookahead.
- Around line 171-173: MiniCssExtractPlugin is being instantiated even in dev
where style-loader is used; update the webpack config to only push/instantiate
MiniCssExtractPlugin when in production mode (e.g. when process.env.NODE_ENV ===
'production' or config.mode === 'production'), keeping the current filename
(styleFileName) for the plugin when added; modify the plugins array construction
so that MiniCssExtractPlugin is conditionally included (and not created) in dev,
leaving style-loader handling CSS during development.
ℹ️ Review info
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📜 Review details
🧰 Additional context used
📓 Path-based instructions (1)
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
packages/transition-frontend/package.json
🧠 Learnings (6)
📚 Learning: 2025-12-17T22:46:52.336Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Applied to files:
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:08:56.828Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:105-107
Timestamp: 2025-09-25T17:08:56.828Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred changing the wrapBatchAccessMap input file validation from `hasInputFile()` to `getFilePath('input')` (actual file existence check), indicating it will be addressed in an upcoming file access refactor.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:09:26.332Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:85-91
Timestamp: 2025-09-25T17:09:26.332Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred improving input file validation to check actual file existence on disk (using getFilePath('input') instead of just hasInputFile() metadata check), indicating it should be addressed when file access is refactored soon.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Use i18next and the `t()` function for all user-facing strings to support internationalization
Applied to files:
packages/transition-frontend/webpack.config.js
🔇 Additional comments (9)
packages/transition-frontend/package.json (1)
98-98: Looks good!
style-loaderas a devDependency makes sense — it's only needed for the webpack build. Alphabetical placement is correct too.packages/transition-frontend/webpack.config.js (8)
46-51: Nice approach for dev filenames.Static filenames in dev avoid accumulating hashed files. Production retains
[contenthash]for cache-busting. Clean split.
55-58: Good pattern for resolving package roots.Using
require.resolve+path.dirnameis reliable in monorepo/workspace setups.
133-149: Loader chain is correct.
sass-loader→css-loader→styleLoaderfollows the right processing order, with the dev/prod switch cleanly abstracted.
174-195: DefinePlugin values look correct.All values properly wrapped in
JSON.stringify. The formatting cleanup is a nice touch.
206-215:CopyWebpackPluginupdated to modern syntax — looks good.
28-30: Minor formatting change — fine.
66-68: Entry composition logic preserved, just reformatted.
221-235: Dev alias for SCSS source files — confirmed working.This correctly enables live SCSS iteration without running
copy-files. The relative imports within the style files (e.g.,@use "settings") resolve properly when read fromsrc/styles, and the npm-style imports in transition-frontend (e.g.,@use "~chaire-lib-frontend/lib/styles/settings") are correctly intercepted and redirected by the alias to the source directory.
kaligrafy
approved these changes
Feb 24, 2026
samuel-duhaime
force-pushed
the
reloadCSSInDevMode
branch
2 times, most recently
from
d70a01e to
c7b20a0
Compare
There was a problem hiding this comment.
Actionable comments posted: 5
♻️ Duplicate comments (1)
packages/transition-frontend/webpack.config.js (1)
171-173: 🧹 Nitpick | 🔵 TrivialOptional: only instantiate
MiniCssExtractPluginin production.Dev uses
style-loader, so keeping this plugin in dev is extra work for no benefit. (This was previously raised; still optional.)Proposed diff
- new MiniCssExtractPlugin({ - filename: styleFileName - }), + ...(isProduction + ? [ + new MiniCssExtractPlugin({ + filename: styleFileName + }) + ] + : []),🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 171 - 173, The MiniCssExtractPlugin instantiation should be added to the plugins array only for production builds (dev uses style-loader), so wrap or conditionally push new MiniCssExtractPlugin({ filename: styleFileName }) based on the build mode (e.g. process.env.NODE_ENV === 'production' or an existing isProd/mode variable in webpack.config.js) instead of always instantiating it; update the plugins construction in webpack.config.js to include MiniCssExtractPlugin only when production so dev builds do not create the plugin.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/transition-frontend/package.json`:
- Line 43: The dependency "mini-css-extract-plugin" is currently listed in
package.json dependencies but is only needed for webpack builds; remove the
"mini-css-extract-plugin" entry from the top-level "dependencies" and add the
same version string under "devDependencies" in package.json (keeping it
alongside other build tools like "webpack" and "clean-webpack-plugin"), then run
your package manager to update the lockfile so the change is applied.
In `@packages/transition-frontend/webpack.config.js`:
- Around line 66-68: The code currently builds and checks the custom styles path
using string concatenation ('./' + customStylesFilePath) which breaks if
config.projectDir or cwd are absolute; update the fs.existsSync check and the
entry array to use path.resolve (or path.join + path.resolve) so both the
existence test and the value pushed into entry use the same resolved absolute
path; specifically, resolve customStylesFilePath into resolvedCustomStylesPath
(used in the fs.existsSync(resolvedCustomStylesPath) call) and push that
resolved path into the entry array alongside entryFileName.
- Line 196: The AggressiveMergingPlugin (new
webpack.optimize.AggressiveMergingPlugin()) is being added unconditionally; move
its instantiation behind a production check so it only runs for production
builds to avoid slowing dev/watch incremental rebuilds. Update the config where
plugins are assembled (reference the webpack.optimize.AggressiveMergingPlugin
entry and the plugins array) to conditionally push/create the plugin only when
the build mode is production (e.g., check process.env.NODE_ENV === 'production'
or argv.mode === 'production' / a boolean isProd) so dev builds omit the plugin.
- Around line 28-30: The config destructuring that currently removes
trRoutingCacheAllScenarios and routing should also exclude backend-only
properties tokenLifespanDays, maxParallelCalculators, projectDirectory,
userDiskQuota, and maxFileUploadMB so they are not exposed via __CONFIG__;
update the destructuring assignment (the const that currently reads "const {
trRoutingCacheAllScenarios, routing, ...config } = configuration.default ?
configuration.default : configuration;") to include these property names in the
left-hand list so the resulting config object omits them.
- Around line 162-166: Replace the CleanWebpackPlugin option
cleanAfterEveryBuildPatterns with cleanOnceBeforeBuildPatterns inside the new
CleanWebpackPlugin(...) config so the output directory is cleaned before emit
instead of after; keep the same pattern array ['**/*', '!images/**', '!*.html']
(or adjust exclusions if you want to protect other emitted asset types) and
preserve other flags (dry, verbose) in the CleanWebpackPlugin instantiation to
ensure JS/CSS bundles emitted by the build are not removed post-build by the
CleanWebpackPlugin.
---
Duplicate comments:
In `@packages/transition-frontend/webpack.config.js`:
- Around line 171-173: The MiniCssExtractPlugin instantiation should be added to
the plugins array only for production builds (dev uses style-loader), so wrap or
conditionally push new MiniCssExtractPlugin({ filename: styleFileName }) based
on the build mode (e.g. process.env.NODE_ENV === 'production' or an existing
isProd/mode variable in webpack.config.js) instead of always instantiating it;
update the plugins construction in webpack.config.js to include
MiniCssExtractPlugin only when production so dev builds do not create the
plugin.
ℹ️ Review info
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📜 Review details
🧰 Additional context used
📓 Path-based instructions (1)
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
packages/transition-frontend/package.json
🧠 Learnings (5)
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2025-12-17T22:46:52.336Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:08:56.828Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:105-107
Timestamp: 2025-09-25T17:08:56.828Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred changing the wrapBatchAccessMap input file validation from `hasInputFile()` to `getFilePath('input')` (actual file existence check), indicating it will be addressed in an upcoming file access refactor.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Use i18next and the `t()` function for all user-facing strings to support internationalization
Applied to files:
packages/transition-frontend/webpack.config.js
🔇 Additional comments (12)
packages/transition-frontend/package.json (1)
98-98:style-loaderas a devDependency matches the dev CSS-injection goal.This aligns with the webpack switch to inject CSS in dev; just make sure
yarn build:devresolves the loader correctly with your lockfile.packages/transition-frontend/webpack.config.js (11)
46-51: Dev/prod bundle/style naming split is clear and keeps contenthash in prod.The
.devsuffix for non-prod should avoid confusion with production assets while preserving long-term caching for prod.
55-59:styleLoaderswitch + package-root discovery look correct.Using
style-loaderin dev andMiniCssExtractPlugin.loaderin prod is the right split for “CSS injected on reload”, andrequire.resolve('chaire-lib-frontend/package.json')should work for both workspace and installed setups.
78-81:stats.children = trueis OK (expect noisier logs).No functional concern; just be aware it can bloat console output in CI/dev.
94-110: Watch ignore regex: please sanity-check rebuild behavior (it’s easy to regress).Given the negative-lookahead + path-escaping, please confirm:
- SCSS edits under
chaire-lib-frontend/src/stylestrigger a rebuild in dev- other
node_modulesedits do not*/lib/styles/*really stays ignored (since dev alias points tosrc/styles)
152-157: Good guard for i18next overrides when custom locales are missing.This should prevent the loader from getting a bogus overrides path when a project doesn’t provide
locales/.
167-170: Explicit HtmlWebpackPlugin template path is fine.No concerns.
206-215: CopyWebpackPluginpatternssyntax looks correct for v13.No concerns.
134-149: SCSS rule is correctly configured for dev/prod distinction.The webpack config properly separates development and production:
style-loaderis used only in dev (injecting CSS via<style>tags), while the hardcoded CSS filename at line 51 is used only in production viaMiniCssExtractPlugin. No hardcoded CSS references were found in HTML/template files. No action needed.
221-237: Dev SCSS alias is actively used and correctly configured.Verified: Source files import from
chaire-lib-frontend/lib/styles/(e.g., app-transition.tsx, transition.scss), confirming the alias redirects these to src/styles in dev mode. Thefallback: { path: false }is safe—no browser-side code imports the Node.jspathmodule; only build and test configs use it. The setup properly enables hot reloading of SCSS without bundling both copies.
174-195: DefinePlugin: JSON.stringify(undefined) for unused env vars is benign; CONFIG filtering is already in place.The code already filters backend-sensitive config keys (
trRoutingCacheAllScenarios,routing) before spreading into__CONFIG__at lines 28–30, mitigating that safety concern. Environment variables without defaults (HOST,TRROUTING_HOST,PROJECT_SOURCE,GOOGLE_API_KEY) are not accessed in the frontend code and will stringify to the literal string"undefined"harmlessly. Variables that are actively used (likeCUSTOM_RASTER_TILES_*) already have fallback logic and proper guards in place (e.g.,TransitionMainMap.tsxlines 124–126).No action needed; the defensive patterns are already present.
116-119: ts-loader exclusion is correct for this monorepo setup.The
exclude: /node_modules/is intentional becausechaire-lib-frontendis pre-compiled tolib/in a parallel step (yarn compile:dev), and transition-frontend imports only fromchaire-lib-frontend/lib/...paths. The watchOptions regex triggers webpack rebuilds when chaire-lib-frontend source changes, but ts-loader doesn't need to transpile its TypeScript—it consumes the pre-compiled output. This design aligns with the intended "watch chaire-lib-frontend" story.
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/transition-frontend/webpack.config.js (1)
152-157: 🧹 Nitpick | 🔵 TrivialResolve the custom locales path before
fs.existsSync.Keeps the check stable across different working directories.
Proposed change
- const customLocalesFilePath = `${config.projectDir}/locales`; + const customLocalesFilePath = `${config.projectDir}/locales`; + const resolvedCustomLocalesFilePath = path.resolve(customLocalesFilePath); @@ - overrides: fs.existsSync('./' + customLocalesFilePath) ? ['../' + customLocalesFilePath] : [] + overrides: fs.existsSync(resolvedCustomLocalesFilePath) + ? ['../' + customLocalesFilePath] + : []🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 152 - 157, The fs.existsSync check is using './' + customLocalesFilePath which can break across working directories; resolve the custom locales path first and use that resolved path in the exists check and in the overrides value. Locate the webpack rule where loader '@alienfast/i18next-loader' is configured (the options block with basenameAsNamespace and overrides) and replace the './' + customLocalesFilePath usage with a path-resolved variable (e.g., path.resolve or path.join applied to customLocalesFilePath) so both the fs.existsSync call and the overrides entry use the same resolved path.
♻️ Duplicate comments (5)
packages/transition-frontend/package.json (1)
43-43: 🧹 Nitpick | 🔵 TrivialMove
mini-css-extract-pluginback to devDependencies.It’s build-time only; keeping it in runtime deps adds install weight.
Proposed change
@@ - "mini-css-extract-plugin": "^2.9.4", @@ "devDependencies": { + "mini-css-extract-plugin": "^2.9.4",🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/package.json` at line 43, The package "mini-css-extract-plugin" is a build-time only tool but currently lives in dependencies; move "mini-css-extract-plugin" from dependencies into devDependencies in package.json so it is not installed at runtime, then update the lockfile (run npm/yarn install) to reflect the change and verify builds still work; locate the "mini-css-extract-plugin" entry in package.json and cut it from the dependencies section and paste it under devDependencies.packages/transition-frontend/webpack.config.js (4)
28-30:⚠️ Potential issue | 🟠 MajorExclude backend-only config fields before shipping
__CONFIG__.Only two fields are stripped right now; consider omitting backend-only fields (e.g., tokenLifespanDays, maxParallelCalculators, projectDirectory, userDiskQuota, maxFileUploadMB) if present.
Proposed change
-const { trRoutingCacheAllScenarios, routing, ...config } = configuration.default +const { + trRoutingCacheAllScenarios, + routing, + tokenLifespanDays, + maxParallelCalculators, + projectDirectory, + userDiskQuota, + maxFileUploadMB, + ...config +} = configuration.default ? configuration.default : configuration;🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 28 - 30, The build currently only strips trRoutingCacheAllScenarios and routing from configuration (via the destructuring const { trRoutingCacheAllScenarios, routing, ...config } = configuration.default ? configuration.default : configuration;) but still may ship backend-only fields in __CONFIG__; update the logic that produces the exported __CONFIG__ (the variable/config object built from config) to explicitly omit backend-only keys such as tokenLifespanDays, maxParallelCalculators, projectDirectory, userDiskQuota, and maxFileUploadMB before passing it to DefinePlugin or wherever __CONFIG__ is emitted; locate the destructuring and the code that assigns/serializes __CONFIG__ and filter those keys out (or build a whitelist) so only intended frontend config is shipped.
64-68: 🧹 Nitpick | 🔵 TrivialResolve the custom styles path before the exists check.
The
./prefix is fragile whenprojectDiris absolute.Proposed change
- const entry = fs.existsSync('./' + customStylesFilePath) - ? [entryFileName, './' + customStylesFilePath] + const resolvedCustomStylesFilePath = path.resolve(customStylesFilePath); + const entry = fs.existsSync(resolvedCustomStylesFilePath) + ? [entryFileName, resolvedCustomStylesFilePath] : [entryFileName];🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 64 - 68, Resolve the customStylesFilePath before checking existence and building the webpack entry: create a resolved path (e.g., use path.resolve) from customStylesFilePath, call fs.existsSync on that resolved path, and when adding to entry convert the resolved path to a webpack-friendly relative path (e.g., path.relative(process.cwd(), resolvedPath) and prefix with './' if needed) so the fs.existsSync and entry array use correct absolute/relative values; update references to customStylesFilePath, entry, and the fs.existsSync call accordingly.
162-166:⚠️ Potential issue | 🟠 Major
cleanAfterEveryBuildPatternscan delete emitted JS/CSS.Switch to cleaning before build instead of after.
Proposed change
- cleanAfterEveryBuildPatterns: ['**/*', '!images/**', '!*.html'] + cleanOnceBeforeBuildPatterns: ['**/*', '!images/**', '!*.html']🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 162 - 166, The CleanWebpackPlugin is currently using cleanAfterEveryBuildPatterns which can remove emitted JS/CSS after build; change the plugin config in webpack.config.js to clean before build by replacing cleanAfterEveryBuildPatterns with cleanOnceBeforeBuildPatterns (preserving the exclude patterns like '!images/**' and '!*.html') and keep the dry/verbose flags (refer to the CleanWebpackPlugin instantiation and the isProduction variable) so cleanup runs prior to emit instead of deleting built assets post-build.
196-196: 🧹 Nitpick | 🔵 TrivialGate AggressiveMergingPlugin to production builds.
It can slow dev/watch rebuilds.
Proposed change
- new webpack.optimize.AggressiveMergingPlugin(), //Merge chunks + ...(isProduction ? [new webpack.optimize.AggressiveMergingPlugin()] : []), // Merge chunks🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` at line 196, The AggressiveMergingPlugin instantiation (new webpack.optimize.AggressiveMergingPlugin()) should be added only for production builds to avoid slowing dev/watch; locate the plugins array where AggressiveMergingPlugin is added and wrap that entry in a conditional that checks the build mode (e.g., process.env.NODE_ENV === 'production' or an existing isProd/mode variable) so the plugin is pushed/returned only when in production mode; ensure the rest of the plugins array remains unchanged and that the conditional preserves plugin order.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@packages/transition-frontend/webpack.config.js`:
- Around line 152-157: The fs.existsSync check is using './' +
customLocalesFilePath which can break across working directories; resolve the
custom locales path first and use that resolved path in the exists check and in
the overrides value. Locate the webpack rule where loader
'@alienfast/i18next-loader' is configured (the options block with
basenameAsNamespace and overrides) and replace the './' + customLocalesFilePath
usage with a path-resolved variable (e.g., path.resolve or path.join applied to
customLocalesFilePath) so both the fs.existsSync call and the overrides entry
use the same resolved path.
---
Duplicate comments:
In `@packages/transition-frontend/package.json`:
- Line 43: The package "mini-css-extract-plugin" is a build-time only tool but
currently lives in dependencies; move "mini-css-extract-plugin" from
dependencies into devDependencies in package.json so it is not installed at
runtime, then update the lockfile (run npm/yarn install) to reflect the change
and verify builds still work; locate the "mini-css-extract-plugin" entry in
package.json and cut it from the dependencies section and paste it under
devDependencies.
In `@packages/transition-frontend/webpack.config.js`:
- Around line 28-30: The build currently only strips trRoutingCacheAllScenarios
and routing from configuration (via the destructuring const {
trRoutingCacheAllScenarios, routing, ...config } = configuration.default ?
configuration.default : configuration;) but still may ship backend-only fields
in __CONFIG__; update the logic that produces the exported __CONFIG__ (the
variable/config object built from config) to explicitly omit backend-only keys
such as tokenLifespanDays, maxParallelCalculators, projectDirectory,
userDiskQuota, and maxFileUploadMB before passing it to DefinePlugin or wherever
__CONFIG__ is emitted; locate the destructuring and the code that
assigns/serializes __CONFIG__ and filter those keys out (or build a whitelist)
so only intended frontend config is shipped.
- Around line 64-68: Resolve the customStylesFilePath before checking existence
and building the webpack entry: create a resolved path (e.g., use path.resolve)
from customStylesFilePath, call fs.existsSync on that resolved path, and when
adding to entry convert the resolved path to a webpack-friendly relative path
(e.g., path.relative(process.cwd(), resolvedPath) and prefix with './' if
needed) so the fs.existsSync and entry array use correct absolute/relative
values; update references to customStylesFilePath, entry, and the fs.existsSync
call accordingly.
- Around line 162-166: The CleanWebpackPlugin is currently using
cleanAfterEveryBuildPatterns which can remove emitted JS/CSS after build; change
the plugin config in webpack.config.js to clean before build by replacing
cleanAfterEveryBuildPatterns with cleanOnceBeforeBuildPatterns (preserving the
exclude patterns like '!images/**' and '!*.html') and keep the dry/verbose flags
(refer to the CleanWebpackPlugin instantiation and the isProduction variable) so
cleanup runs prior to emit instead of deleting built assets post-build.
- Line 196: The AggressiveMergingPlugin instantiation (new
webpack.optimize.AggressiveMergingPlugin()) should be added only for production
builds to avoid slowing dev/watch; locate the plugins array where
AggressiveMergingPlugin is added and wrap that entry in a conditional that
checks the build mode (e.g., process.env.NODE_ENV === 'production' or an
existing isProd/mode variable) so the plugin is pushed/returned only when in
production mode; ensure the rest of the plugins array remains unchanged and that
the conditional preserves plugin order.
ℹ️ Review info
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📜 Review details
🧰 Additional context used
📓 Path-based instructions (1)
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
packages/transition-frontend/package.json
🧠 Learnings (8)
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2025-12-17T22:46:52.336Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:08:56.828Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:105-107
Timestamp: 2025-09-25T17:08:56.828Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred changing the wrapBatchAccessMap input file validation from `hasInputFile()` to `getFilePath('input')` (actual file existence check), indicating it will be addressed in an upcoming file access refactor.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:09:26.332Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:85-91
Timestamp: 2025-09-25T17:09:26.332Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred improving input file validation to check actual file existence on disk (using getFilePath('input') instead of just hasInputFile() metadata check), indicating it should be addressed when file access is refactored soon.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:40:55.314Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/executableJob/ExecutableJob.ts:152-158
Timestamp: 2025-09-25T16:40:55.314Z
Learning: In packages/transition-backend/src/services/executableJob/ExecutableJob.ts, greenscientist deferred improving the hasFile() method to check actual file existence on disk rather than just metadata, indicating it should be addressed in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Use i18next and the `t()` function for all user-facing strings to support internationalization
Applied to files:
packages/transition-frontend/webpack.config.js
🔇 Additional comments (10)
packages/transition-frontend/package.json (1)
98-98:style-loaderdevDependency addition looks good.packages/transition-frontend/webpack.config.js (9)
46-51: Bundle/style naming per env looks good.
55-58: Dev/prod style loader switch is correct.Also applies to: 135-137
78-81: Statschildren: trueis fine.
93-110: Selective watch ignore looks fine.
116-119: Excluding node_modules for ts-loader is fine.
167-170: Html template path update looks good.
174-193: DefinePlugin env wiring looks consistent.
206-215: CopyWebpackPlugin patterns syntax looks good.
217-236: Dev-only SCSS aliasing is a good fit.
tahini
reviewed
Feb 24, 2026
| : // Ignore all node_modules except chaire-lib-frontend, | ||
| // and also specifically ignore the lib/styles directory of chaire-lib-frontend and transition-frontend | ||
| // (which we override via an alias to src/styles). | ||
| new RegExp( |
Collaborator
There was a problem hiding this comment.
Maybe describe what each replace does? especially the last one.... .replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}
samuel-duhaime
force-pushed
the
reloadCSSInDevMode
branch
from
c7b20a0 to
366eeb7
Compare
There was a problem hiding this comment.
♻️ Duplicate comments (2)
packages/transition-frontend/webpack.config.js (2)
28-30:⚠️ Potential issue | 🟠 MajorUse an explicit frontend allowlist before defining
__CONFIG__.On Line 28 and Line 195,
...configstill forwards almost the full server config to the browser. Please build a dedicated frontend-safe object and stringify that instead.Also applies to: 195-197
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 28 - 30, The diff currently spreads server config into the client bundle via the destructuring const { trRoutingCacheAllScenarios, routing, ...config } = configuration.default ? configuration.default : configuration and later stringifies a large object into __CONFIG__; instead create a whitelist object (e.g., frontendAllowlist or frontendConfig) that explicitly picks only safe keys/values (for example include trRoutingCacheAllScenarios if safe, routing subset, public feature flags, API base URLs, etc.), construct that object instead of using ...config, and then stringify that whitelist when defining __CONFIG__; update references in webpack.config.js (the destructuring block and the __CONFIG__ assignment around lines where __CONFIG__ is built) so only the frontend-safe object is exposed to the browser.
66-68:⚠️ Potential issue | 🟠 MajorResolve custom paths directly instead of prefixing
'./'.On Line 66 and Line 159,
'./' + custom...can break whenconfig.projectDiris absolute, causing custom styles/locales to be skipped.💡 Suggested patch
const customStylesFilePath = `${config.projectDir}/styles/styles.scss`; const customLocalesFilePath = `${config.projectDir}/locales`; -const entry = fs.existsSync('./' + customStylesFilePath) - ? [entryFileName, './' + customStylesFilePath] +const resolvedCustomStylesFilePath = path.resolve(customStylesFilePath); +const resolvedCustomLocalesFilePath = path.resolve(customLocalesFilePath); +const entry = fs.existsSync(resolvedCustomStylesFilePath) + ? [entryFileName, resolvedCustomStylesFilePath] : [entryFileName]; ... - overrides: fs.existsSync('./' + customLocalesFilePath) ? ['../' + customLocalesFilePath] : [] + overrides: fs.existsSync(resolvedCustomLocalesFilePath) + ? [resolvedCustomLocalesFilePath] + : []#!/bin/bash set -euo pipefail # 1) Confirm current path handling in webpack config nl -ba packages/transition-frontend/webpack.config.js | sed -n '60,75p;154,162p' # 2) Check how projectDir/projectDirectory is built in config sources # Expected: if values are absolute/path-resolved, './' concatenation is unsafe. rg -n -C2 '\bprojectDir\b|\bprojectDirectory\b|path\.resolve\(|process\.cwd\(' packages -g '*server.config.ts' -g '*project.config*' | head -200Also applies to: 159-159
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 66 - 68, The code builds entry arrays using string concatenation ('./' + customStylesFilePath and './' + customLocalesFilePath) which breaks for absolute projectDir values; update the checks and entries to use the actual resolved path instead of prefixing './' — e.g., use fs.existsSync(customStylesFilePath) and push customStylesFilePath directly into the entry array, or explicitly resolve with path.resolve(projectDir, customStylesFilePath) when projectDir is used; apply the same fix for customLocalesFilePath so the 'entry' construction and existence checks use resolved/actual paths rather than './' + ...
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@packages/transition-frontend/webpack.config.js`:
- Around line 28-30: The diff currently spreads server config into the client
bundle via the destructuring const { trRoutingCacheAllScenarios, routing,
...config } = configuration.default ? configuration.default : configuration and
later stringifies a large object into __CONFIG__; instead create a whitelist
object (e.g., frontendAllowlist or frontendConfig) that explicitly picks only
safe keys/values (for example include trRoutingCacheAllScenarios if safe,
routing subset, public feature flags, API base URLs, etc.), construct that
object instead of using ...config, and then stringify that whitelist when
defining __CONFIG__; update references in webpack.config.js (the destructuring
block and the __CONFIG__ assignment around lines where __CONFIG__ is built) so
only the frontend-safe object is exposed to the browser.
- Around line 66-68: The code builds entry arrays using string concatenation
('./' + customStylesFilePath and './' + customLocalesFilePath) which breaks for
absolute projectDir values; update the checks and entries to use the actual
resolved path instead of prefixing './' — e.g., use
fs.existsSync(customStylesFilePath) and push customStylesFilePath directly into
the entry array, or explicitly resolve with path.resolve(projectDir,
customStylesFilePath) when projectDir is used; apply the same fix for
customLocalesFilePath so the 'entry' construction and existence checks use
resolved/actual paths rather than './' + ...
ℹ️ Review info
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: test-sequential (24.x)
- GitHub Check: build-and-test (24.x)
- GitHub Check: pr-build-check
- GitHub Check: build-and-run-UI-tests (24.x)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
packages/transition-frontend/package.json
🧠 Learnings (9)
📓 Common learnings
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
📚 Learning: 2025-12-17T22:46:52.336Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Applied to files:
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:08:56.828Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:105-107
Timestamp: 2025-09-25T17:08:56.828Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred changing the wrapBatchAccessMap input file validation from `hasInputFile()` to `getFilePath('input')` (actual file existence check), indicating it will be addressed in an upcoming file access refactor.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:09:26.332Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:85-91
Timestamp: 2025-09-25T17:09:26.332Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred improving input file validation to check actual file existence on disk (using getFilePath('input') instead of just hasInputFile() metadata check), indicating it should be addressed when file access is refactored soon.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:40:55.314Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/executableJob/ExecutableJob.ts:152-158
Timestamp: 2025-09-25T16:40:55.314Z
Learning: In packages/transition-backend/src/services/executableJob/ExecutableJob.ts, greenscientist deferred improving the hasFile() method to check actual file existence on disk rather than just metadata, indicating it should be addressed in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Use i18next and the `t()` function for all user-facing strings to support internationalization
Applied to files:
packages/transition-frontend/webpack.config.js
Fix: chairemobilite#1792 - Added `style-loader` version 4.0.0 to the project dependencies in `package.json`. - Updated `webpack.config.js` to use `style-loader` for injecting CSS in development mode, allowing SCSS changes to apply after reload without a separate .css file. - Made minor formatting adjustments for better readability in the configuration file. - Explain the Regex so we can understand that in a few years.
samuel-duhaime
force-pushed
the
reloadCSSInDevMode
branch
from
366eeb7 to
d2e1fa8
Compare
There was a problem hiding this comment.
♻️ Duplicate comments (2)
packages/transition-frontend/webpack.config.js (2)
28-30:⚠️ Potential issue | 🟠 MajorExclude backend-only fields before exposing
__CONFIG__.At Line 28, only two keys are stripped, while Line 195 sends the remaining config to the browser. Please also remove backend-only keys (token/runtime/path/quota-related) before serializing.
Suggested patch
-const { trRoutingCacheAllScenarios, routing, ...config } = configuration.default +const { + trRoutingCacheAllScenarios, + routing, + tokenLifespanDays, + maxParallelCalculators, + projectDirectory, + userDiskQuota, + maxFileUploadMB, + ...config +} = configuration.default ? configuration.default : configuration;Also applies to: 195-197
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 28 - 30, The current destructuring only removes trRoutingCacheAllScenarios and routing from configuration (const { trRoutingCacheAllScenarios, routing, ...config } = configuration.default ? configuration.default : configuration;) but still sends backend-only fields to the client when serializing __CONFIG__; update the logic that builds config before it is serialized (the variable named config / the block that writes __CONFIG__) to strip backend-only keys (e.g., token, runtime, path, any quota-related keys) either by extending the destructuring to remove those keys or by cloning and deleting them, ensuring only safe, whitelisted settings are left before JSON.stringify/__CONFIG__ assignment.
66-68:⚠️ Potential issue | 🟠 MajorUse a resolved path for custom style entry detection.
At Line 66,
'./' + customStylesFilePathcan fail whenconfig.projectDiris absolute, so custom styles are silently not included.Suggested patch
const customStylesFilePath = `${config.projectDir}/styles/styles.scss`; const customLocalesFilePath = `${config.projectDir}/locales`; -const entry = fs.existsSync('./' + customStylesFilePath) - ? [entryFileName, './' + customStylesFilePath] +const resolvedCustomStylesFilePath = path.resolve(customStylesFilePath); +const entry = fs.existsSync(resolvedCustomStylesFilePath) + ? [entryFileName, resolvedCustomStylesFilePath] : [entryFileName];🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/transition-frontend/webpack.config.js` around lines 66 - 68, The entry array construction uses a relative './' + customStylesFilePath which can miss files when config.projectDir is absolute; update the check and pushed path to use path.resolve or path.join with config.projectDir to produce an absolute path for fs.existsSync and for the entry array so customStylesFilePath is detected and included. Specifically, change the logic around the entry variable (where entryFileName and customStylesFilePath are combined) to compute const resolvedCustomStyles = path.resolve(config.projectDir, customStylesFilePath) (or equivalent) and use that for fs.existsSync(resolvedCustomStyles) and when adding the style path to the entry array. Ensure entryFileName remains unchanged.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@packages/transition-frontend/webpack.config.js`:
- Around line 28-30: The current destructuring only removes
trRoutingCacheAllScenarios and routing from configuration (const {
trRoutingCacheAllScenarios, routing, ...config } = configuration.default ?
configuration.default : configuration;) but still sends backend-only fields to
the client when serializing __CONFIG__; update the logic that builds config
before it is serialized (the variable named config / the block that writes
__CONFIG__) to strip backend-only keys (e.g., token, runtime, path, any
quota-related keys) either by extending the destructuring to remove those keys
or by cloning and deleting them, ensuring only safe, whitelisted settings are
left before JSON.stringify/__CONFIG__ assignment.
- Around line 66-68: The entry array construction uses a relative './' +
customStylesFilePath which can miss files when config.projectDir is absolute;
update the check and pushed path to use path.resolve or path.join with
config.projectDir to produce an absolute path for fs.existsSync and for the
entry array so customStylesFilePath is detected and included. Specifically,
change the logic around the entry variable (where entryFileName and
customStylesFilePath are combined) to compute const resolvedCustomStyles =
path.resolve(config.projectDir, customStylesFilePath) (or equivalent) and use
that for fs.existsSync(resolvedCustomStyles) and when adding the style path to
the entry array. Ensure entryFileName remains unchanged.
ℹ️ Review info
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/transition-frontend/package.jsonpackages/transition-frontend/webpack.config.js
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
- GitHub Check: code-lint
- GitHub Check: build-and-test (24.x)
- GitHub Check: test-sequential (24.x)
- GitHub Check: build-and-run-UI-tests (24.x)
- GitHub Check: pr-build-check
🧰 Additional context used
📓 Path-based instructions (1)
**/*.json
📄 CodeRabbit inference engine (.cursor/rules/project-rule.mdc)
Translation files in
locales/directory should organize strings by namespace (auth.json, transit.json, main.json, etc.) with support for both English (en/) and French (fr/) languages
Files:
packages/transition-frontend/package.json
🧠 Learnings (9)
📓 Common learnings
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/**/*.tsx : React components should use Redux for state management, i18next for translations, and SCSS for styling
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2025-12-17T22:46:52.336Z
Learnt from: tahini
Repo: chairemobilite/transition PR: 1666
File: packages/chaire-lib-frontend/package.json:60-60
Timestamp: 2025-12-17T22:46:52.336Z
Learning: In packages/chaire-lib-frontend/package.json, the `testing-library/dom` devDependency is required for tests to pass even though it's not explicitly imported. It was previously provided as a transitive dependency through `react-select-event`, but after removing `react-select-event`, it must be explicitly declared.
Applied to files:
packages/transition-frontend/webpack.config.jspackages/transition-frontend/package.json
📚 Learning: 2025-09-25T17:08:56.828Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:105-107
Timestamp: 2025-09-25T17:08:56.828Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred changing the wrapBatchAccessMap input file validation from `hasInputFile()` to `getFilePath('input')` (actual file existence check), indicating it will be addressed in an upcoming file access refactor.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to packages/transition-frontend/src/components/routers/*.tsx : Application routing should be defined in `TransitionRouter.tsx` using React Router with feature-based route organization
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:09:00.577Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts:42-45
Timestamp: 2025-09-25T16:09:00.577Z
Learning: In packages/transition-backend/src/services/transitRouting/TrAccessibilityMapBatch.ts, greenscientist deferred adding input file validation using `if (!job.hasInputFile())` and requested to be reminded about it in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T17:09:26.332Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/tasks/TransitionWorkerPool.ts:85-91
Timestamp: 2025-09-25T17:09:26.332Z
Learning: In packages/transition-backend/src/tasks/TransitionWorkerPool.ts, greenscientist deferred improving input file validation to check actual file existence on disk (using getFilePath('input') instead of just hasInputFile() metadata check), indicating it should be addressed when file access is refactored soon.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2025-09-25T16:40:55.314Z
Learnt from: greenscientist
Repo: chairemobilite/transition PR: 1494
File: packages/transition-backend/src/services/executableJob/ExecutableJob.ts:152-158
Timestamp: 2025-09-25T16:40:55.314Z
Learning: In packages/transition-backend/src/services/executableJob/ExecutableJob.ts, greenscientist deferred improving the hasFile() method to check actual file existence on disk rather than just metadata, indicating it should be addressed in a later PR.
Applied to files:
packages/transition-frontend/webpack.config.js
📚 Learning: 2026-02-03T20:40:36.982Z
Learnt from: CR
Repo: chairemobilite/transition PR: 0
File: .cursor/rules/project-rule.mdc:0-0
Timestamp: 2026-02-03T20:40:36.982Z
Learning: Applies to **/*.{ts,tsx} : Use i18next and the `t()` function for all user-facing strings to support internationalization
Applied to files:
packages/transition-frontend/webpack.config.js
tahini
approved these changes
Feb 25, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Issue
Description
Refactor: Refresh the CSS in dev mode
Fix: #1792
style-loaderversion 4.0.0 to the project dependencies inpackage.json.webpack.config.jsto usestyle-loaderfor injecting CSS in development mode, allowing SCSS changes to apply after reload without a separate .css file.Summary by CodeRabbit