@nx/react 0.0.0-pr-29464-ef5660f → 0.0.0-pr-29720-06f67e5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/package.json +6 -6
  2. package/src/generators/application/application.js +9 -48
  3. package/src/generators/application/lib/add-e2e.js +24 -29
  4. package/src/generators/application/lib/add-linting.d.ts +0 -1
  5. package/src/generators/application/lib/add-linting.js +0 -38
  6. package/src/generators/application/lib/add-project.js +15 -31
  7. package/src/generators/application/lib/add-routing.js +1 -1
  8. package/src/generators/application/lib/bundlers/add-vite.js +6 -15
  9. package/src/generators/application/lib/create-application-files.js +4 -41
  10. package/src/generators/application/lib/install-common-dependencies.js +2 -13
  11. package/src/generators/application/lib/normalize-options.d.ts +2 -0
  12. package/src/generators/application/lib/normalize-options.js +20 -11
  13. package/src/generators/application/schema.d.ts +1 -5
  14. package/src/generators/application/schema.json +1 -10
  15. package/src/generators/host/host.js +3 -6
  16. package/src/generators/init/init.js +0 -23
  17. package/src/generators/init/schema.d.ts +0 -2
  18. package/src/generators/library/lib/add-rollup-build-target.d.ts +1 -3
  19. package/src/generators/library/lib/add-rollup-build-target.js +7 -6
  20. package/src/generators/library/lib/create-files.js +1 -2
  21. package/src/generators/library/lib/normalize-options.js +5 -8
  22. package/src/generators/library/library.js +15 -21
  23. package/src/generators/library/schema.d.ts +0 -2
  24. package/src/generators/library/schema.json +0 -4
  25. package/src/generators/remote/remote.js +9 -12
  26. package/src/utils/ast-utils.d.ts +1 -1
  27. package/src/utils/ast-utils.js +2 -2
  28. package/src/utils/versions.d.ts +1 -3
  29. package/src/utils/versions.js +3 -6
  30. package/router-plugin.d.ts +0 -1
  31. package/router-plugin.js +0 -5
  32. package/src/generators/application/files/react-router-ssr/common/app/app-nav.tsx__tmpl__ +0 -15
  33. package/src/generators/application/files/react-router-ssr/common/app/entry.client.tsx__tmpl__ +0 -18
  34. package/src/generators/application/files/react-router-ssr/common/app/entry.server.tsx__tmpl__ +0 -74
  35. package/src/generators/application/files/react-router-ssr/common/app/root.tsx__tmpl__ +0 -51
  36. package/src/generators/application/files/react-router-ssr/common/app/routes/about.tsx__tmpl__ +0 -7
  37. package/src/generators/application/files/react-router-ssr/common/app/routes.tsx__tmpl__ +0 -6
  38. package/src/generators/application/files/react-router-ssr/common/public/favicon.ico +0 -0
  39. package/src/generators/application/files/react-router-ssr/common/react-router.config.ts__tmpl__ +0 -5
  40. package/src/generators/application/files/react-router-ssr/common/tests/routes/_index.spec.tsx__tmpl__ +0 -16
  41. package/src/generators/application/files/react-router-ssr/common/tsconfig.app.json__tmpl__ +0 -23
  42. package/src/generators/application/files/react-router-ssr/common/tsconfig.json__tmpl__ +0 -27
  43. package/src/generators/application/files/react-router-ssr/non-root/.gitignore__tmpl__ +0 -5
  44. package/src/generators/application/files/react-router-ssr/non-root/package.json__tmpl__ +0 -24
  45. package/src/generators/application/files/react-router-ssr/nx-welcome/claimed/app/nx-welcome.tsx__tmpl__ +0 -866
  46. package/src/generators/application/files/react-router-ssr/nx-welcome/not-configured/app/nx-welcome.tsx__tmpl__ +0 -866
  47. package/src/generators/application/files/react-router-ssr/nx-welcome/unclaimed/app/nx-welcome.tsx__tmpl__ +0 -864
  48. package/src/generators/application/files/react-router-ssr/ts-solution/package.json__tmpl__ +0 -24
  49. package/src/generators/application/files/react-router-ssr/ts-solution/tsconfig.app.json__tmpl__ +0 -39
  50. package/src/plugins/router-plugin.d.ts +0 -10
  51. package/src/plugins/router-plugin.js +0 -219
@@ -1,864 +0,0 @@
1
- /*
2
- * * * * * * * * * * * * * * * * * * * * * * * * * * * *
3
- This is a starter component and can be deleted.
4
- * * * * * * * * * * * * * * * * * * * * * * * * * * * *
5
- Delete this file and get started with your project!
6
- * * * * * * * * * * * * * * * * * * * * * * * * * * * *
7
- */
8
- export function NxWelcome({ title }: { title: string }) {
9
- return (
10
- <>
11
- <style
12
- dangerouslySetInnerHTML={{
13
- __html: `
14
- html {
15
- -webkit-text-size-adjust: 100%;
16
- font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
17
- 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
18
- 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
19
- 'Noto Color Emoji';
20
- line-height: 1.5;
21
- tab-size: 4;
22
- scroll-behavior: smooth;
23
- }
24
- body {
25
- font-family: inherit;
26
- line-height: inherit;
27
- margin: 0;
28
- }
29
- h1,
30
- h2,
31
- p,
32
- pre {
33
- margin: 0;
34
- }
35
- *,
36
- ::before,
37
- ::after {
38
- box-sizing: border-box;
39
- border-width: 0;
40
- border-style: solid;
41
- border-color: currentColor;
42
- }
43
- h1,
44
- h2 {
45
- font-size: inherit;
46
- font-weight: inherit;
47
- }
48
- a {
49
- color: inherit;
50
- text-decoration: inherit;
51
- }
52
- pre {
53
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
54
- 'Liberation Mono', 'Courier New', monospace;
55
- }
56
- svg {
57
- display: block;
58
- vertical-align: middle;
59
- shape-rendering: auto;
60
- text-rendering: optimizeLegibility;
61
- }
62
- pre {
63
- background-color: rgba(55, 65, 81, 1);
64
- border-radius: 0.25rem;
65
- color: rgba(229, 231, 235, 1);
66
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
67
- 'Liberation Mono', 'Courier New', monospace;
68
- overflow: auto;
69
- padding: 0.5rem 0.75rem;
70
- }
71
-
72
- .shadow {
73
- box-shadow: 0 0 #0000, 0 0 #0000, 0 10px 15px -3px rgba(0, 0, 0, 0.1),
74
- 0 4px 6px -2px rgba(0, 0, 0, 0.05);
75
- }
76
- .rounded {
77
- border-radius: 1.5rem;
78
- }
79
- .wrapper {
80
- width: 100%;
81
- }
82
- .container {
83
- margin-left: auto;
84
- margin-right: auto;
85
- max-width: 768px;
86
- padding-bottom: 3rem;
87
- padding-left: 1rem;
88
- padding-right: 1rem;
89
- color: rgba(55, 65, 81, 1);
90
- width: 100%;
91
- }
92
- #welcome {
93
- margin-top: 2.5rem;
94
- }
95
- #welcome h1 {
96
- font-size: 3rem;
97
- font-weight: 500;
98
- letter-spacing: -0.025em;
99
- line-height: 1;
100
- }
101
- #welcome span {
102
- display: block;
103
- font-size: 1.875rem;
104
- font-weight: 300;
105
- line-height: 2.25rem;
106
- margin-bottom: 0.5rem;
107
- }
108
- #hero {
109
- align-items: center;
110
- background-color: hsla(214, 62%, 21%, 1);
111
- border: none;
112
- box-sizing: border-box;
113
- color: rgba(55, 65, 81, 1);
114
- display: grid;
115
- grid-template-columns: 1fr;
116
- margin-top: 3.5rem;
117
- }
118
- #hero .text-container {
119
- color: rgba(255, 255, 255, 1);
120
- padding: 3rem 2rem;
121
- }
122
- #hero .text-container h2 {
123
- font-size: 1.5rem;
124
- line-height: 2rem;
125
- position: relative;
126
- }
127
- #hero .text-container h2 svg {
128
- color: hsla(162, 47%, 50%, 1);
129
- height: 2rem;
130
- left: -0.25rem;
131
- position: absolute;
132
- top: 0;
133
- width: 2rem;
134
- }
135
- #hero .text-container h2 span {
136
- margin-left: 2.5rem;
137
- }
138
- #hero .text-container a {
139
- background-color: rgba(255, 255, 255, 1);
140
- border-radius: 0.75rem;
141
- color: rgba(55, 65, 81, 1);
142
- display: inline-block;
143
- margin-top: 1.5rem;
144
- padding: 1rem 2rem;
145
- text-decoration: inherit;
146
- }
147
- #hero .logo-container {
148
- display: none;
149
- justify-content: center;
150
- padding-left: 2rem;
151
- padding-right: 2rem;
152
- }
153
- #hero .logo-container svg {
154
- color: rgba(255, 255, 255, 1);
155
- width: 66.666667%;
156
- }
157
- #middle-content {
158
- align-items: flex-start;
159
- display: grid;
160
- grid-template-columns: 1fr;
161
- margin-top: 3.5rem;
162
- }
163
-
164
- #middle-content #middle-content-container {
165
- display: flex;
166
- flex-direction: column;
167
- gap: 2rem;
168
- }
169
- #learning-materials {
170
- padding: 2.5rem 2rem;
171
- }
172
- #learning-materials h2 {
173
- font-weight: 500;
174
- font-size: 1.25rem;
175
- letter-spacing: -0.025em;
176
- line-height: 1.75rem;
177
- padding-left: 1rem;
178
- padding-right: 1rem;
179
- }
180
- .list-item-link {
181
- align-items: center;
182
- border-radius: 0.75rem;
183
- display: flex;
184
- margin-top: 1rem;
185
- padding: 1rem;
186
- transition-property: background-color, border-color, color, fill, stroke,
187
- opacity, box-shadow, transform, filter, backdrop-filter,
188
- -webkit-backdrop-filter;
189
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
190
- transition-duration: 150ms;
191
- width: 100%;
192
- }
193
- .list-item-link svg:first-child {
194
- margin-right: 1rem;
195
- height: 1.5rem;
196
- transition-property: background-color, border-color, color, fill, stroke,
197
- opacity, box-shadow, transform, filter, backdrop-filter,
198
- -webkit-backdrop-filter;
199
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
200
- transition-duration: 150ms;
201
- width: 1.5rem;
202
- }
203
- .list-item-link > span {
204
- flex-grow: 1;
205
- font-weight: 400;
206
- transition-property: background-color, border-color, color, fill, stroke,
207
- opacity, box-shadow, transform, filter, backdrop-filter,
208
- -webkit-backdrop-filter;
209
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
210
- }
211
- .list-item-link > span > span {
212
- color: rgba(107, 114, 128, 1);
213
- display: block;
214
- flex-grow: 1;
215
- font-size: 0.75rem;
216
- font-weight: 300;
217
- line-height: 1rem;
218
- transition-property: background-color, border-color, color, fill, stroke,
219
- opacity, box-shadow, transform, filter, backdrop-filter,
220
- -webkit-backdrop-filter;
221
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
222
- }
223
- .list-item-link svg:last-child {
224
- height: 1rem;
225
- transition-property: all;
226
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
227
- transition-duration: 150ms;
228
- width: 1rem;
229
- }
230
- .list-item-link:hover {
231
- color: rgba(255, 255, 255, 1);
232
- background-color: hsla(162, 55%, 33%, 1);
233
- }
234
- .list-item-link:hover > span {}
235
- .list-item-link:hover > span > span {
236
- color: rgba(243, 244, 246, 1);
237
- }
238
- .list-item-link:hover svg:last-child {
239
- transform: translateX(0.25rem);
240
- }
241
- #other-links {}
242
- .button-pill {
243
- padding: 1.5rem 2rem;
244
- margin-bottom: 2rem;
245
- transition-duration: 300ms;
246
- transition-property: background-color, border-color, color, fill, stroke,
247
- opacity, box-shadow, transform, filter, backdrop-filter,
248
- -webkit-backdrop-filter;
249
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
250
- align-items: center;
251
- display: flex;
252
- }
253
- .button-pill svg {
254
- transition-property: background-color, border-color, color, fill, stroke,
255
- opacity, box-shadow, transform, filter, backdrop-filter,
256
- -webkit-backdrop-filter;
257
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
258
- transition-duration: 150ms;
259
- flex-shrink: 0;
260
- width: 3rem;
261
- }
262
- .button-pill > span {
263
- letter-spacing: -0.025em;
264
- font-weight: 400;
265
- font-size: 1.125rem;
266
- line-height: 1.75rem;
267
- padding-left: 1rem;
268
- padding-right: 1rem;
269
- }
270
- .button-pill span span {
271
- display: block;
272
- font-size: 0.875rem;
273
- font-weight: 300;
274
- line-height: 1.25rem;
275
- }
276
- .button-pill:hover svg,
277
- .button-pill:hover {
278
- color: rgba(255, 255, 255, 1) !important;
279
- }
280
- #nx-console:hover {
281
- background-color: rgba(0, 122, 204, 1);
282
- }
283
- #nx-console svg {
284
- color: rgba(0, 122, 204, 1);
285
- }
286
- #nx-console-jetbrains {
287
- margin-top: 2rem;
288
- }
289
- #nx-console-jetbrains:hover {
290
- background-color: rgba(255, 49, 140, 1);
291
- }
292
- #nx-console-jetbrains svg {
293
- color: rgba(255, 49, 140, 1);
294
- }
295
- #nx-repo:hover {
296
- background-color: rgba(24, 23, 23, 1);
297
- }
298
- #nx-repo svg {
299
- color: rgba(24, 23, 23, 1);
300
- }
301
- #nx-cloud {
302
- margin-bottom: 2rem;
303
- margin-top: 2rem;
304
- padding: 2.5rem 2rem;
305
- }
306
- #nx-cloud > div {
307
- align-items: center;
308
- display: flex;
309
- }
310
- #nx-cloud > div svg {
311
- border-radius: 0.375rem;
312
- flex-shrink: 0;
313
- width: 3rem;
314
- }
315
- #nx-cloud > div h2 {
316
- font-size: 1.125rem;
317
- font-weight: 400;
318
- letter-spacing: -0.025em;
319
- line-height: 1.75rem;
320
- padding-left: 1rem;
321
- padding-right: 1rem;
322
- }
323
- #nx-cloud > div h2 span {
324
- display: block;
325
- font-size: 0.875rem;
326
- font-weight: 300;
327
- line-height: 1.25rem;
328
- }
329
- #nx-cloud p {
330
- font-size: 1rem;
331
- line-height: 1.5rem;
332
- margin-top: 1rem;
333
- }
334
- #nx-cloud pre {
335
- margin-top: 1rem;
336
- }
337
- #nx-cloud a {
338
- border-radius: 0.75rem;
339
- color: white;
340
- background-color: hsla(214, 62%, 21%, 1);
341
- display: inline-block;
342
- margin-top: 1.5rem;
343
- padding: 0.5rem 1rem;
344
- text-align:left;
345
- text-decoration: inherit;
346
- }
347
-
348
- #commands {
349
- padding: 2.5rem 2rem;
350
- margin-top: 3.5rem;
351
- }
352
- #commands h2 {
353
- font-size: 1.25rem;
354
- font-weight: 400;
355
- letter-spacing: -0.025em;
356
- line-height: 1.75rem;
357
- padding-left: 1rem;
358
- padding-right: 1rem;
359
- }
360
- #commands p {
361
- font-size: 1rem;
362
- font-weight: 300;
363
- line-height: 1.5rem;
364
- margin-top: 1rem;
365
- padding-left: 1rem;
366
- padding-right: 1rem;
367
- }
368
- details {
369
- align-items: center;
370
- display: flex;
371
- margin-top: 1rem;
372
- padding-left: 1rem;
373
- padding-right: 1rem;
374
- width: 100%;
375
- }
376
- details pre > span {
377
- color: rgba(181, 181, 181, 1);
378
- display: block;
379
- }
380
- summary {
381
- border-radius: 0.5rem;
382
- display: flex;
383
- font-weight: 400;
384
- padding: 0.5rem;
385
- cursor: pointer;
386
- transition-property: background-color, border-color, color, fill, stroke,
387
- opacity, box-shadow, transform, filter, backdrop-filter,
388
- -webkit-backdrop-filter;
389
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
390
- transition-duration: 150ms;
391
- }
392
- summary:hover {
393
- background-color: rgba(243, 244, 246, 1);
394
- }
395
- summary svg {
396
- height: 1.5rem;
397
- margin-right: 1rem;
398
- width: 1.5rem;
399
- }
400
- #love {
401
- color: rgba(107, 114, 128, 1);
402
- font-size: 0.875rem;
403
- line-height: 1.25rem;
404
- margin-top: 3.5rem;
405
- opacity: 0.6;
406
- text-align: center;
407
- }
408
- #love svg {
409
- color: rgba(252, 165, 165, 1);
410
- width: 1.25rem;
411
- height: 1.25rem;
412
- display: inline;
413
- margin-top: -0.25rem;
414
- }
415
- @media screen and (min-width: 768px) {
416
- #hero {
417
- grid-template-columns: repeat(2, minmax(0, 1fr));
418
- }
419
- #hero .logo-container {
420
- display: flex;
421
- }
422
- #middle-content {
423
- grid-template-columns: repeat(2, minmax(0, 1fr));
424
- gap: 4rem;
425
- }
426
- }
427
- `,
428
- }}
429
- />
430
- <div className="wrapper">
431
- <div className="container">
432
- <div id="welcome">
433
- <h1>
434
- <span> Hello there, </span>
435
- Welcome {title} 👋
436
- </h1>
437
- </div>
438
-
439
- <div id="hero" className="rounded">
440
- <div className="text-container">
441
- <h2>
442
- <svg
443
- fill="none"
444
- stroke="currentColor"
445
- viewBox="0 0 24 24"
446
- xmlns="http://www.w3.org/2000/svg"
447
- >
448
- <path
449
- strokeLinecap="round"
450
- strokeLinejoin="round"
451
- strokeWidth="2"
452
- d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z"
453
- />
454
- </svg>
455
- <span>You&apos;re up and running</span>
456
- </h2>
457
- <a href="#commands"> What&apos;s next? </a>
458
- </div>
459
- <div className="logo-container">
460
- <svg
461
- fill="currentColor"
462
- role="img"
463
- viewBox="0 0 24 24"
464
- xmlns="http://www.w3.org/2000/svg"
465
- >
466
- <path d="M11.987 14.138l-3.132 4.923-5.193-8.427-.012 8.822H0V4.544h3.691l5.247 8.833.005-3.998 3.044 4.759zm.601-5.761c.024-.048 0-3.784.008-3.833h-3.65c.002.059-.005 3.776-.003 3.833h3.645zm5.634 4.134a2.061 2.061 0 0 0-1.969 1.336 1.963 1.963 0 0 1 2.343-.739c.396.161.917.422 1.33.283a2.1 2.1 0 0 0-1.704-.88zm3.39 1.061c-.375-.13-.8-.277-1.109-.681-.06-.08-.116-.17-.176-.265a2.143 2.143 0 0 0-.533-.642c-.294-.216-.68-.322-1.18-.322a2.482 2.482 0 0 0-2.294 1.536 2.325 2.325 0 0 1 4.002.388.75.75 0 0 0 .836.334c.493-.105.46.36 1.203.518v-.133c-.003-.446-.246-.55-.75-.733zm2.024 1.266a.723.723 0 0 0 .347-.638c-.01-2.957-2.41-5.487-5.37-5.487a5.364 5.364 0 0 0-4.487 2.418c-.01-.026-1.522-2.39-1.538-2.418H8.943l3.463 5.423-3.379 5.32h3.54l1.54-2.366 1.568 2.366h3.541l-3.21-5.052a.7.7 0 0 1-.084-.32 2.69 2.69 0 0 1 2.69-2.691h.001c1.488 0 1.736.89 2.057 1.308.634.826 1.9.464 1.9 1.541a.707.707 0 0 0 1.066.596zm.35.133c-.173.372-.56.338-.755.639-.176.271.114.412.114.412s.337.156.538-.311c.104-.231.14-.488.103-.74z" />
467
- </svg>
468
- </div>
469
- </div>
470
-
471
- <div id="middle-content">
472
- <div id="middle-content-container">
473
- <div id="learning-materials" className="rounded shadow">
474
- <h2>Learning materials</h2>
475
- <a
476
- href="https://nx.dev/getting-started/intro?utm_source=nx-project"
477
- target="_blank"
478
- rel="noreferrer"
479
- className="list-item-link"
480
- >
481
- <svg
482
- fill="none"
483
- stroke="currentColor"
484
- viewBox="0 0 24 24"
485
- xmlns="http://www.w3.org/2000/svg"
486
- >
487
- <path
488
- strokeLinecap="round"
489
- strokeLinejoin="round"
490
- strokeWidth="2"
491
- d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"
492
- />
493
- </svg>
494
- <span>
495
- Documentation
496
- <span> Everything is in there </span>
497
- </span>
498
- <svg
499
- fill="none"
500
- stroke="currentColor"
501
- viewBox="0 0 24 24"
502
- xmlns="http://www.w3.org/2000/svg"
503
- >
504
- <path
505
- strokeLinecap="round"
506
- strokeLinejoin="round"
507
- strokeWidth="2"
508
- d="M9 5l7 7-7 7"
509
- />
510
- </svg>
511
- </a>
512
- <a
513
- href="https://nx.dev/blog/?utm_source=nx-project"
514
- target="_blank"
515
- rel="noreferrer"
516
- className="list-item-link"
517
- >
518
- <svg
519
- fill="none"
520
- stroke="currentColor"
521
- viewBox="0 0 24 24"
522
- xmlns="http://www.w3.org/2000/svg"
523
- >
524
- <path
525
- strokeLinecap="round"
526
- strokeLinejoin="round"
527
- strokeWidth="2"
528
- d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z"
529
- />
530
- </svg>
531
- <span>
532
- Blog
533
- <span> Changelog, features & events </span>
534
- </span>
535
- <svg
536
- fill="none"
537
- stroke="currentColor"
538
- viewBox="0 0 24 24"
539
- xmlns="http://www.w3.org/2000/svg"
540
- >
541
- <path
542
- strokeLinecap="round"
543
- strokeLinejoin="round"
544
- strokeWidth="2"
545
- d="M9 5l7 7-7 7"
546
- />
547
- </svg>
548
- </a>
549
- <a
550
- href="https://www.youtube.com/@NxDevtools/videos?utm_source=nx-project&sub_confirmation=1"
551
- target="_blank"
552
- rel="noreferrer"
553
- className="list-item-link"
554
- >
555
- <svg
556
- role="img"
557
- viewBox="0 0 24 24"
558
- fill="currentColor"
559
- xmlns="http://www.w3.org/2000/svg"
560
- >
561
- <title>YouTube</title>
562
- <path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" />
563
- </svg>
564
- <span>
565
- YouTube channel
566
- <span> Nx Show, talks & tutorials </span>
567
- </span>
568
- <svg
569
- fill="none"
570
- stroke="currentColor"
571
- viewBox="0 0 24 24"
572
- xmlns="http://www.w3.org/2000/svg"
573
- >
574
- <path
575
- strokeLinecap="round"
576
- strokeLinejoin="round"
577
- strokeWidth="2"
578
- d="M9 5l7 7-7 7"
579
- />
580
- </svg>
581
- </a>
582
- <a
583
- href="https://nx.dev/recipes/react/remix#remix-with-nx"
584
- target="_blank"
585
- rel="noreferrer"
586
- className="list-item-link"
587
- >
588
- <svg
589
- fill="none"
590
- stroke="currentColor"
591
- viewBox="0 0 24 24"
592
- xmlns="http://www.w3.org/2000/svg"
593
- >
594
- <path
595
- strokeLinecap="round"
596
- strokeLinejoin="round"
597
- strokeWidth="2"
598
- d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122"
599
- />
600
- </svg>
601
- <span>
602
- Interactive tutorials
603
- <span> Create an app, step-by-step </span>
604
- </span>
605
- <svg
606
- fill="none"
607
- stroke="currentColor"
608
- viewBox="0 0 24 24"
609
- xmlns="http://www.w3.org/2000/svg"
610
- >
611
- <path
612
- strokeLinecap="round"
613
- strokeLinejoin="round"
614
- strokeWidth="2"
615
- d="M9 5l7 7-7 7"
616
- />
617
- </svg>
618
- </a>
619
- </div>
620
- <a
621
- id="nx-repo"
622
- className="button-pill rounded shadow"
623
- href="https://github.com/nrwl/nx?utm_source=nx-project"
624
- target="_blank"
625
- rel="noreferrer"
626
- >
627
- <svg
628
- fill="currentColor"
629
- role="img"
630
- viewBox="0 0 24 24"
631
- xmlns="http://www.w3.org/2000/svg"
632
- >
633
- <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" />
634
- </svg>
635
- <span>
636
- Nx is open source
637
- <span> Love Nx? Give us a star! </span>
638
- </span>
639
- </a>
640
- </div>
641
- <div id="other-links">
642
- <a
643
- id="nx-console"
644
- className="button-pill rounded shadow"
645
- href="https://marketplace.visualstudio.com/items?itemName=nrwl.angular-console&utm_source=nx-project"
646
- target="_blank"
647
- rel="noreferrer"
648
- >
649
- <svg
650
- fill="currentColor"
651
- role="img"
652
- viewBox="0 0 24 24"
653
- xmlns="http://www.w3.org/2000/svg"
654
- >
655
- <title>Visual Studio Code</title>
656
- <path d="M23.15 2.587L18.21.21a1.494 1.494 0 0 0-1.705.29l-9.46 8.63-4.12-3.128a.999.999 0 0 0-1.276.057L.327 7.261A1 1 0 0 0 .326 8.74L3.899 12 .326 15.26a1 1 0 0 0 .001 1.479L1.65 17.94a.999.999 0 0 0 1.276.057l4.12-3.128 9.46 8.63a1.492 1.492 0 0 0 1.704.29l4.942-2.377A1.5 1.5 0 0 0 24 20.06V3.939a1.5 1.5 0 0 0-.85-1.352zm-5.146 14.861L10.826 12l7.178-5.448v10.896z" />
657
- </svg>
658
- <span>
659
- Install Nx Console for VSCode
660
- <span>The official VSCode extension for Nx.</span>
661
- </span>
662
- </a>
663
- <a
664
- id="nx-console-jetbrains"
665
- className="button-pill rounded shadow"
666
- href="https://plugins.jetbrains.com/plugin/21060-nx-console"
667
- target="_blank"
668
- rel="noreferrer"
669
- >
670
- <svg
671
- height="48"
672
- width="48"
673
- viewBox="20 20 60 60"
674
- xmlns="http://www.w3.org/2000/svg"
675
- >
676
- <path d="m22.5 22.5h60v60h-60z" />
677
- <g fill="#fff">
678
- <path d="m29.03 71.25h22.5v3.75h-22.5z" />
679
- <path d="m28.09 38 1.67-1.58a1.88 1.88 0 0 0 1.47.87c.64 0 1.06-.44 1.06-1.31v-5.98h2.58v6a3.48 3.48 0 0 1 -.87 2.6 3.56 3.56 0 0 1 -2.57.95 3.84 3.84 0 0 1 -3.34-1.55z" />
680
- <path d="m36 30h7.53v2.19h-5v1.44h4.49v2h-4.42v1.49h5v2.21h-7.6z" />
681
- <path d="m47.23 32.29h-2.8v-2.29h8.21v2.27h-2.81v7.1h-2.6z" />
682
- <path d="m29.13 43.08h4.42a3.53 3.53 0 0 1 2.55.83 2.09 2.09 0 0 1 .6 1.53 2.16 2.16 0 0 1 -1.44 2.09 2.27 2.27 0 0 1 1.86 2.29c0 1.61-1.31 2.59-3.55 2.59h-4.44zm5 2.89c0-.52-.42-.8-1.18-.8h-1.29v1.64h1.24c.79 0 1.25-.26 1.25-.81zm-.9 2.66h-1.57v1.73h1.62c.8 0 1.24-.31 1.24-.86 0-.5-.4-.87-1.27-.87z" />
683
- <path d="m38 43.08h4.1a4.19 4.19 0 0 1 3 1 2.93 2.93 0 0 1 .9 2.19 3 3 0 0 1 -1.93 2.89l2.24 3.27h-3l-1.88-2.84h-.87v2.84h-2.56zm4 4.5c.87 0 1.39-.43 1.39-1.11 0-.75-.54-1.12-1.4-1.12h-1.44v2.26z" />
684
- <path d="m49.59 43h2.5l4 9.44h-2.79l-.67-1.69h-3.63l-.67 1.69h-2.71zm2.27 5.73-1-2.65-1.06 2.65z" />
685
- <path d="m56.46 43.05h2.6v9.37h-2.6z" />
686
- <path d="m60.06 43.05h2.42l3.37 5v-5h2.57v9.37h-2.26l-3.53-5.14v5.14h-2.57z" />
687
- <path d="m68.86 51 1.45-1.73a4.84 4.84 0 0 0 3 1.13c.71 0 1.08-.24 1.08-.65 0-.4-.31-.6-1.59-.91-2-.46-3.53-1-3.53-2.93 0-1.74 1.37-3 3.62-3a5.89 5.89 0 0 1 3.86 1.25l-1.26 1.84a4.63 4.63 0 0 0 -2.62-.92c-.63 0-.94.25-.94.6 0 .42.32.61 1.63.91 2.14.46 3.44 1.16 3.44 2.91 0 1.91-1.51 3-3.79 3a6.58 6.58 0 0 1 -4.35-1.5z" />
688
- </g>
689
- </svg>
690
- <span>
691
- Install Nx Console for JetBrains
692
- <span>
693
- Available for WebStorm, Intellij IDEA Ultimate and more!
694
- </span>
695
- </span>
696
- </a>
697
- <div id="nx-cloud" className="rounded shadow">
698
- <div>
699
- <svg
700
- id="nx-cloud-logo"
701
- role="img"
702
- xmlns="http://www.w3.org/2000/svg"
703
- stroke="currentColor"
704
- fill="transparent"
705
- viewBox="0 0 24 24"
706
- >
707
- <path
708
- strokeWidth="2"
709
- d="M23 3.75V6.5c-3.036 0-5.5 2.464-5.5 5.5s-2.464 5.5-5.5 5.5-5.5 2.464-5.5 5.5H3.75C2.232 23 1 21.768 1 20.25V3.75C1 2.232 2.232 1 3.75 1h16.5C21.768 1 23 2.232 23 3.75Z"
710
- />
711
- <path
712
- strokeWidth="2"
713
- d="M23 6v14.1667C23 21.7307 21.7307 23 20.1667 23H6c0-3.128 2.53867-5.6667 5.6667-5.6667 3.128 0 5.6666-2.5386 5.6666-5.6666C17.3333 8.53867 19.872 6 23 6Z"
714
- />
715
- </svg>
716
- <h2>
717
- Nx Cloud
718
- <span>Enable faster CI & better DX</span>
719
- </h2>
720
- </div>
721
- <p>
722
- Your Nx Cloud remote cache setup is almost complete.
723
- </p>
724
-
725
- <a
726
- href="<%= connectCloudUrl %>"
727
- target="_blank"
728
- rel="noreferrer"
729
- >
730
- Click here to finish
731
- </a>
732
- </div>
733
- </div>
734
- </div>
735
-
736
- <div id="commands" className="rounded shadow">
737
- <h2>Next steps</h2>
738
- <p>Here are some things you can do with Nx:</p>
739
- <details>
740
- <summary>
741
- <svg
742
- fill="none"
743
- stroke="currentColor"
744
- viewBox="0 0 24 24"
745
- xmlns="http://www.w3.org/2000/svg"
746
- >
747
- <path
748
- strokeLinecap="round"
749
- strokeLinejoin="round"
750
- strokeWidth="2"
751
- d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
752
- />
753
- </svg>
754
- Build, test and lint your app
755
- </summary>
756
- <pre><% if ( rootProject ) { %>
757
- <span># Build</span>
758
- nx build
759
- <span># Test</span>
760
- nx test
761
- <span># Lint</span>
762
- nx lint
763
- <span># Run them together!</span>
764
- nx run-many -t build test lint
765
- <% } else { %>
766
- <span># Build</span>
767
- nx build {title}
768
- <span># Test</span>
769
- nx test {title}
770
- <span># Lint</span>
771
- nx lint {title}
772
- <span># Run them together!</span>
773
- nx run-many -p {title} -t build test lint
774
- <% } %>
775
- </pre>
776
- </details>
777
-
778
- <details>
779
- <summary>
780
- <svg
781
- fill="none"
782
- stroke="currentColor"
783
- viewBox="0 0 24 24"
784
- xmlns="http://www.w3.org/2000/svg"
785
- >
786
- <path
787
- strokeLinecap="round"
788
- strokeLinejoin="round"
789
- strokeWidth="2"
790
- d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
791
- />
792
- </svg>
793
- View project details
794
- </summary>
795
- <pre>nx show project {title}</pre>
796
- </details>
797
- <details>
798
- <summary>
799
- <svg
800
- fill="none"
801
- stroke="currentColor"
802
- viewBox="0 0 24 24"
803
- xmlns="http://www.w3.org/2000/svg"
804
- >
805
- <path
806
- strokeLinecap="round"
807
- strokeLinejoin="round"
808
- strokeWidth="2"
809
- d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
810
- />
811
- </svg>
812
- View interactive project graph
813
- </summary>
814
- <pre>nx graph</pre>
815
- </details>
816
- <details>
817
- <summary>
818
- <svg
819
- fill="none"
820
- stroke="currentColor"
821
- viewBox="0 0 24 24"
822
- xmlns="http://www.w3.org/2000/svg"
823
- >
824
- <path
825
- strokeLinecap="round"
826
- strokeLinejoin="round"
827
- strokeWidth="2"
828
- d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"
829
- />
830
- </svg>
831
- Add UI library
832
- </summary>
833
- <pre>
834
- <span># Generate UI lib</span>
835
- nx g @nx/react:lib ui
836
- <span># Add a component</span>
837
- nx g @nx/react:component ui/src/lib/button
838
- </pre>
839
- </details>
840
- </div>
841
-
842
- <p id="love">
843
- Carefully crafted with
844
- <svg
845
- fill="currentColor"
846
- stroke="none"
847
- viewBox="0 0 24 24"
848
- xmlns="http://www.w3.org/2000/svg"
849
- >
850
- <path
851
- strokeLinecap="round"
852
- strokeLinejoin="round"
853
- strokeWidth="2"
854
- d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"
855
- />
856
- </svg>
857
- </p>
858
- </div>
859
- </div>
860
- </>
861
- );
862
- }
863
-
864
- export default NxWelcome;