build(cli): integrate nx

[addisonbeck]

🎟️ Tracking

https://bitwarden.atlassian.net/browse/PM-24802

All other clients are dependent on this PR for the new nx webpack plugin

• build(web): integrate nx #16706
• build(browser): integrate nx #16712

📔 Objective

Enable Nx builds in the cli. For example:

# basic commands
npx nx serve cli
npx nx build cli
npx nx test cli
npx nx lint cli

# target the bit-dev build 
npx nx serve cli --configuration=bit-dev

# targeting a production build (no "dev" suffix)
npx nx build cli --configuration=bit

Most complexity here is that we need to support the pre-nx build pipelines for a while, so we have to juggle both configurations. The recent refactor of our webpack config to a webpack config factory was pretty helpful here. I added a bunch of optional parameters that come from Nx in Nx builds.

Once we update CI to use Nx builds exclusively, and the Nx builds have had time to get battle tested, we'll remove the old npm builds and this configuration will get a bit simpler since we can start just depending on values from params.

Otherwise, this is a fairly straightforward port of the build commands from cli's package.json into a functioning project.json. It uses the standard executors and follows Nx conventions for this kind of build without much else that is special.

I've included some docs on using Nx in a root level docs folder. I got architecture's blessing to create this folder here.

📸 Screenshots

Here are some screenshots of various local nx builds. These aren't comprehensive, and the project.json should be reviewed to see what is available. I think I've verified that they all work locally. In CI you can reference the "Experimental Nx CI" job to see what is passing and what isn't. Please note this job will pass even if there are errors, so it should be reviewed even if it's green. For convenience I've included a screenshot of the last CI run showing

⏰ Reminders before review

• Contributor guidelines followed
• All formatters and local linters executed and passed
• Written new unit and / or integration tests where applicable
• Protected functional changes with optionality (feature flags)
• Used internationalization (i18n) for all UI strings
• CI builds passed
• Communicated to DevOps any deployment requirements
• Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team

🦮 Reviewer guidelines

• 👍 (:+1:) or similar for great changes
• 📝 (:memo:) or ℹ️ (:information_source:) for notes or general info
• ❓ (:question:) for questions
• 🤔 (:thinking:) or 💭 (:thought_balloon:) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
• 🎨 (:art:) for suggestions / improvements
• ❌ (:x:) or ⚠️ (:warning:) for more significant problems or concerns needing attention
• 🌱 (:seedling:) or ♻️ (:recycle:) for future improvements or indications of technical debt
• ⛏ (:pick:) for minor or nitpick changes

[github-actions]

Checkmarx One – Scan Summary & Details – 65819417-deb0-4a87-9a83-1010714a6e88

Great job! No new security vulnerabilities introduced in this pull request

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 38.75%. Comparing base (aa3be49) to head (17675f1).
⚠️ Report is 4 commits behind head on main.
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #16648      +/-   ##
==========================================
- Coverage   38.75%   38.75%   -0.01%     
==========================================
  Files        3406     3407       +1     
  Lines       96688    96713      +25     
  Branches    14533    14541       +8     
==========================================
+ Hits        37473    37482       +9     
- Misses      57577    57592      +15     
- Partials     1638     1639       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[addisonbeck]

A lot of these are the default values in webpack.base, but they won't be for long so I was verbose with these args.

[coroiu]

suggestion: instead of putting the default values interspersed in the code

patterns: [{ from: params.localesPath || "./src/locales", to: "locales" }],

could we move it all to one place?

const DEFAULT_PARAMS = {
  outputPath: "...",
  mode: "...",
  env: "...",
  modulesPath: [],
  localesPath: "...",
  externalsModulesDir: "...",
  watch: "...",
};

module.exports.buildConfig = function buildConfig(params) {
  params = { ...DEFAULT_PARAMS, params };

[addisonbeck]

Good idea. Really cleans this up a lot. Implemented as suggested on a72cd0e.

[coroiu]

question/suggestion: should we take this as an opportunity to stop using bit?

Suggested change

	"bit": {
	"commercial": {

[addisonbeck]

implemented as suggested on 537d6d7

I'm going to get a task in Jira for the next Nx focused epic to rename the folders themselves whenever we remove the old npm scripts. No ticket for that right this second but I'm talking to Todd about it.

Screenshot of a "commercial" build passing:

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
4.3% Duplication on New Code

See analysis details on SonarQube Cloud