miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

docs(remix): update the plugin overview to match the latest iteration of the plugin #26943 (#26977)

Browse Source 
<!-- Please make sure you have read the submission guidelines before
posting an PR -->
<!--
https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr
-->

<!-- Please make sure that your commit message follows our format -->
<!-- Example: `fix(nx): must begin with lowercase` -->

<!-- If this is a particularly complex change or feature addition, you
can request a dedicated Nx release for this pull request branch. Mention
someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they
will confirm if the PR warrants its own release for testing purposes,
and generate it for you if appropriate. -->

## Current Behavior
<!-- This is the behavior we have today -->
The information on the Remix Plugin Overview is out of date.


## Expected Behavior
<!-- This is the behavior we should expect with the changes in this PR
-->
The information should be up to date

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #26943
This commit is contained in:
Colum Ferry 2024-07-18 14:36:36 +01:00 committed by GitHub
parent 8633f3d024
commit e38830415f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 78 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
docs/generated/packages/remix/documents/overview.md
View File

@ -6,7 +6,7 @@ description: The Nx Plugin for Remix contains executors, generators, and utiliti
The Nx Plugin for Remix contains executors, generators, and utilities for managing Remix applications and libraries The Nx Plugin for Remix contains executors, generators, and utilities for managing Remix applications and libraries
within an Nx workspace. It provides: within an Nx workspace. It provides:
- Integration with libraries such as Storybook, Jest, Vitest and Cypress. - Integration with libraries such as Storybook, Jest, Vitest, Playwright and Cypress.
- Generators to help scaffold code quickly, including: - Generators to help scaffold code quickly, including:
- Libraries, both internal to your codebase and publishable to npm - Libraries, both internal to your codebase and publishable to npm
- Routes - Routes
@ -57,7 +57,7 @@ The `@nx/remix/plugin` is configured in the `plugins` array in `nx.json`.
"plugin": "@nx/remix/plugin", "plugin": "@nx/remix/plugin",
"options": { "options": {
"buildTargetName": "build", "buildTargetName": "build",
"serveTargetName": "serve", "devTargetName": "dev",
"startTargetName": "start", "startTargetName": "start",
"typecheckTargetName": "typecheck" "typecheckTargetName": "typecheck"
} }
@ -66,7 +66,7 @@ The `@nx/remix/plugin` is configured in the `plugins` array in `nx.json`.
} }
``` ```
The `buildTargetName`, `serveTargetName`, `startTargetName` and `typecheckTargetName` options control the names of the inferred Remix tasks. The default names are `build`, `serve`, `start` and `typecheck`. The `buildTargetName`, `devTargetName`, `startTargetName` and `typecheckTargetName` options control the names of the inferred Remix tasks. The default names are `build`, `dev`, `start` and `typecheck`.
{% /tab %} {% /tab %}
{% tab label="Nx < 18" %} {% tab label="Nx < 18" %}
@ -92,35 +92,32 @@ The command below uses the `as-provided` directory flag behavior, which is the d
NX Generating @nx/remix:application NX Generating @nx/remix:application
✔ What unit test runner should be used? · vitest ✔ What unit test runner should be used? · vitest
✔ Which E2E test runner would you like to use? · playwright
CREATE apps/myapp/project.json
UPDATE package.json UPDATE package.json
UPDATE nx.json
CREATE apps/myapp/project.json
CREATE apps/myapp/README.md CREATE apps/myapp/README.md
CREATE apps/myapp/app/nx-welcome.tsx
CREATE apps/myapp/app/root.tsx CREATE apps/myapp/app/root.tsx
CREATE apps/myapp/app/routes/_index.tsx CREATE apps/myapp/app/routes/_index.tsx
CREATE apps/myapp/public/favicon.ico CREATE apps/myapp/public/favicon.ico
CREATE apps/myapp/remix.config.js CREATE apps/myapp/remix.config.js
CREATE apps/myapp/remix.env.d.ts CREATE apps/myapp/remix.env.d.ts
CREATE apps/myapp/tests/routes/_index.spec.tsx
CREATE apps/myapp/tsconfig.app.json
CREATE apps/myapp/tsconfig.json CREATE apps/myapp/tsconfig.json
CREATE apps/myapp/.gitignore CREATE apps/myapp/.gitignore
CREATE apps/myapp/package.json CREATE apps/myapp/package.json
UPDATE nx.json
CREATE tsconfig.base.json
CREATE .prettierrc
CREATE .prettierignore
UPDATE .vscode/extensions.json
CREATE apps/myapp/vite.config.ts
CREATE apps/myapp/tsconfig.spec.json CREATE apps/myapp/tsconfig.spec.json
CREATE apps/myapp/vitest.config.ts
CREATE apps/myapp/test-setup.ts CREATE apps/myapp/test-setup.ts
CREATE apps/myapp-e2e/cypress.config.ts CREATE apps/myapp/.eslintrc.json
CREATE apps/myapp-e2e/src/e2e/app.cy.ts CREATE apps/myapp/.eslintignore
CREATE apps/myapp-e2e/src/fixtures/example.json
CREATE apps/myapp-e2e/src/support/commands.ts
CREATE apps/myapp-e2e/src/support/e2e.ts
CREATE apps/myapp-e2e/tsconfig.json
CREATE apps/myapp-e2e/project.json CREATE apps/myapp-e2e/project.json
CREATE .eslintrc.json CREATE apps/myapp-e2e/src/example.spec.ts
CREATE .eslintignore CREATE apps/myapp-e2e/playwright.config.ts
CREATE apps/myapp-e2e/tsconfig.json
CREATE apps/myapp-e2e/.eslintrc.json CREATE apps/myapp-e2e/.eslintrc.json
``` ```
@ -142,12 +139,16 @@ NX Successfully ran target build for project myapp (3s)
2. To serve your application for use during development run: 2. To serve your application for use during development run:
```{% command="nx serve myapp" path="~/acme" %} ```{% command="nx dev myapp" path="~/acme" %}
> nx run myapp:serve > nx run myapp:dev
💿 Building... > remix dev --manual
💿 Rebuilt in 377ms
Remix App Server started at http://localhost:3000 (http://192.168.0.14:3000) 💿 remix dev
info building...
info built (388ms)
[remix-serve] http://localhost:3000 (http://192.168.0.12:3000)
``` ```
3. To test the application using vitest run: 3. To test the application using vitest run:
@ -155,18 +156,23 @@ Remix App Server started at http://localhost:3000 (http://192.168.0.14:3000)
```{% command="nx test myapp" path="~/acme" %} ```{% command="nx test myapp" path="~/acme" %}
> nx run myapp:test > nx run myapp:test
RUN v0.31.4 /Users/columferry/dev/nrwl/issues/remixguide/acme/apps/myapp > vitest
stderr | app/routes/index.spec.ts > test > should render
Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.
✓ app/routes/index.spec.ts (1 test) 10ms
Test Files 1 passed (1)
Tests 1 passed (1)
Start at 16:15:45
Duration 1.20s (transform 51ms, setup 139ms, collect 180ms, tests 10ms, environment 379ms, prepare 103ms)
——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
NX Successfully ran target test for project myapp (2s) RUN v1.6.0 /Users/columferry/dev/nrwl/issues/gh_issues/nx26943/apps/myapp
✓ tests/routes/_index.spec.tsx (1)
✓ renders loader data
Test Files 1 passed (1)
Tests 1 passed (1)
Start at 13:22:54
Duration 533ms (transform 47ms, setup 68ms, collect 123ms, tests 36ms, environment 204ms, prepare 35ms)
———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
NX Successfully ran target test for project myapp (950ms)
``` ```
## Generating an Nx Library ## Generating an Nx Library

72
docs/shared/packages/remix/remix-plugin.md
View File

@ -6,7 +6,7 @@ description: The Nx Plugin for Remix contains executors, generators, and utiliti
The Nx Plugin for Remix contains executors, generators, and utilities for managing Remix applications and libraries The Nx Plugin for Remix contains executors, generators, and utilities for managing Remix applications and libraries
within an Nx workspace. It provides: within an Nx workspace. It provides:
- Integration with libraries such as Storybook, Jest, Vitest and Cypress. - Integration with libraries such as Storybook, Jest, Vitest, Playwright and Cypress.
- Generators to help scaffold code quickly, including: - Generators to help scaffold code quickly, including:
- Libraries, both internal to your codebase and publishable to npm - Libraries, both internal to your codebase and publishable to npm
- Routes - Routes
@ -57,7 +57,7 @@ The `@nx/remix/plugin` is configured in the `plugins` array in `nx.json`.
"plugin": "@nx/remix/plugin", "plugin": "@nx/remix/plugin",
"options": { "options": {
"buildTargetName": "build", "buildTargetName": "build",
"serveTargetName": "serve", "devTargetName": "dev",
"startTargetName": "start", "startTargetName": "start",
"typecheckTargetName": "typecheck" "typecheckTargetName": "typecheck"
} }
@ -66,7 +66,7 @@ The `@nx/remix/plugin` is configured in the `plugins` array in `nx.json`.
} }
``` ```
The `buildTargetName`, `serveTargetName`, `startTargetName` and `typecheckTargetName` options control the names of the inferred Remix tasks. The default names are `build`, `serve`, `start` and `typecheck`. The `buildTargetName`, `devTargetName`, `startTargetName` and `typecheckTargetName` options control the names of the inferred Remix tasks. The default names are `build`, `dev`, `start` and `typecheck`.
{% /tab %} {% /tab %}
{% tab label="Nx < 18" %} {% tab label="Nx < 18" %}
@ -92,35 +92,32 @@ The command below uses the `as-provided` directory flag behavior, which is the d
NX Generating @nx/remix:application NX Generating @nx/remix:application
✔ What unit test runner should be used? · vitest ✔ What unit test runner should be used? · vitest
✔ Which E2E test runner would you like to use? · playwright
CREATE apps/myapp/project.json
UPDATE package.json UPDATE package.json
UPDATE nx.json
CREATE apps/myapp/project.json
CREATE apps/myapp/README.md CREATE apps/myapp/README.md
CREATE apps/myapp/app/nx-welcome.tsx
CREATE apps/myapp/app/root.tsx CREATE apps/myapp/app/root.tsx
CREATE apps/myapp/app/routes/_index.tsx CREATE apps/myapp/app/routes/_index.tsx
CREATE apps/myapp/public/favicon.ico CREATE apps/myapp/public/favicon.ico
CREATE apps/myapp/remix.config.js CREATE apps/myapp/remix.config.js
CREATE apps/myapp/remix.env.d.ts CREATE apps/myapp/remix.env.d.ts
CREATE apps/myapp/tests/routes/_index.spec.tsx
CREATE apps/myapp/tsconfig.app.json
CREATE apps/myapp/tsconfig.json CREATE apps/myapp/tsconfig.json
CREATE apps/myapp/.gitignore CREATE apps/myapp/.gitignore
CREATE apps/myapp/package.json CREATE apps/myapp/package.json
UPDATE nx.json
CREATE tsconfig.base.json
CREATE .prettierrc
CREATE .prettierignore
UPDATE .vscode/extensions.json
CREATE apps/myapp/vite.config.ts
CREATE apps/myapp/tsconfig.spec.json CREATE apps/myapp/tsconfig.spec.json
CREATE apps/myapp/vitest.config.ts
CREATE apps/myapp/test-setup.ts CREATE apps/myapp/test-setup.ts
CREATE apps/myapp-e2e/cypress.config.ts CREATE apps/myapp/.eslintrc.json
CREATE apps/myapp-e2e/src/e2e/app.cy.ts CREATE apps/myapp/.eslintignore
CREATE apps/myapp-e2e/src/fixtures/example.json
CREATE apps/myapp-e2e/src/support/commands.ts
CREATE apps/myapp-e2e/src/support/e2e.ts
CREATE apps/myapp-e2e/tsconfig.json
CREATE apps/myapp-e2e/project.json CREATE apps/myapp-e2e/project.json
CREATE .eslintrc.json CREATE apps/myapp-e2e/src/example.spec.ts
CREATE .eslintignore CREATE apps/myapp-e2e/playwright.config.ts
CREATE apps/myapp-e2e/tsconfig.json
CREATE apps/myapp-e2e/.eslintrc.json CREATE apps/myapp-e2e/.eslintrc.json
``` ```
@ -142,12 +139,16 @@ NX Successfully ran target build for project myapp (3s)
2. To serve your application for use during development run: 2. To serve your application for use during development run:
```{% command="nx serve myapp" path="~/acme" %} ```{% command="nx dev myapp" path="~/acme" %}
> nx run myapp:serve > nx run myapp:dev
💿 Building... > remix dev --manual
💿 Rebuilt in 377ms
Remix App Server started at http://localhost:3000 (http://192.168.0.14:3000) 💿 remix dev
info building...
info built (388ms)
[remix-serve] http://localhost:3000 (http://192.168.0.12:3000)
``` ```
3. To test the application using vitest run: 3. To test the application using vitest run:
@ -155,18 +156,23 @@ Remix App Server started at http://localhost:3000 (http://192.168.0.14:3000)
```{% command="nx test myapp" path="~/acme" %} ```{% command="nx test myapp" path="~/acme" %}
> nx run myapp:test > nx run myapp:test
RUN v0.31.4 /Users/columferry/dev/nrwl/issues/remixguide/acme/apps/myapp > vitest
stderr | app/routes/index.spec.ts > test > should render
Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.
✓ app/routes/index.spec.ts (1 test) 10ms
Test Files 1 passed (1)
Tests 1 passed (1)
Start at 16:15:45
Duration 1.20s (transform 51ms, setup 139ms, collect 180ms, tests 10ms, environment 379ms, prepare 103ms)
——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
NX Successfully ran target test for project myapp (2s) RUN v1.6.0 /Users/columferry/dev/nrwl/issues/gh_issues/nx26943/apps/myapp
✓ tests/routes/_index.spec.tsx (1)
✓ renders loader data
Test Files 1 passed (1)
Tests 1 passed (1)
Start at 13:22:54
Duration 533ms (transform 47ms, setup 68ms, collect 123ms, tests 36ms, environment 204ms, prepare 35ms)
———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
NX Successfully ran target test for project myapp (950ms)
``` ```
## Generating an Nx Library ## Generating an Nx Library