@nx/storybook 17.0.3 → 17.0.4
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.
- package/LICENSE +1 -1
- package/README.md +9 -4
- package/generators.json +2 -2
- package/migrations.json +140 -0
- package/package.json +7 -7
- package/plugin.d.ts +1 -0
- package/plugin.js +6 -0
- package/presets/cypress.d.ts +1 -20
- package/src/executors/build-storybook/build-storybook.impl.js +1 -1
- package/src/executors/storybook/storybook.impl.js +1 -1
- package/src/generators/configuration/configuration.d.ts +2 -1
- package/src/generators/configuration/configuration.js +69 -32
- package/src/generators/configuration/lib/edit-root-tsconfig.d.ts +8 -0
- package/src/generators/configuration/lib/edit-root-tsconfig.js +35 -0
- package/src/generators/configuration/lib/ensure-dependencies.d.ts +6 -0
- package/src/generators/configuration/lib/ensure-dependencies.js +70 -0
- package/src/generators/configuration/lib/util-functions.d.ts +11 -5
- package/src/generators/configuration/lib/util-functions.js +88 -69
- package/src/generators/configuration/project-files/.storybook/main.js__tmpl__ +23 -3
- package/src/generators/configuration/project-files-ts/.storybook/main.ts__tmpl__ +22 -3
- package/src/generators/configuration/schema.d.ts +9 -3
- package/src/generators/configuration/schema.json +6 -13
- package/src/generators/cypress-project/cypress-project.d.ts +3 -3
- package/src/generators/cypress-project/cypress-project.js +3 -8
- package/src/generators/cypress-project/schema.json +1 -1
- package/src/generators/init/init.d.ts +1 -0
- package/src/generators/init/init.js +47 -117
- package/src/generators/init/lib/update-gitignore.d.ts +2 -0
- package/src/generators/init/lib/update-gitignore.js +16 -0
- package/src/generators/init/schema.d.ts +5 -4
- package/src/generators/init/schema.json +18 -33
- package/src/migrations/update-16-5-0/move-storybook-tsconfig.js +1 -0
- package/src/plugins/plugin.d.ts +9 -0
- package/src/plugins/plugin.js +232 -0
- package/src/utils/models.d.ts +1 -1
- package/src/utils/utilities.d.ts +1 -0
- package/src/utils/utilities.js +30 -8
- package/src/utils/versions.d.ts +6 -7
- package/src/utils/versions.js +7 -8
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.renameAndMoveOldTsConfig = exports.
|
|
3
|
+
exports.renameAndMoveOldTsConfig = exports.findMetroConfig = exports.findNextConfig = exports.findViteConfig = exports.getE2EProjectName = exports.rootFileIsTs = exports.workspaceHasRootProject = exports.projectIsRootProjectInStandaloneWorkspace = exports.addBuildStorybookToCacheableOperations = exports.getTsConfigPath = exports.createProjectStorybookDir = exports.addStorybookToTargetDefaults = exports.addStorybookToNamedInputs = exports.normalizeSchema = exports.updateLintConfig = exports.configureTsSolutionConfig = exports.configureTsProjectConfig = exports.editTsconfigBaseJson = exports.createStorybookTsconfigFile = exports.addStaticTarget = exports.addAngularStorybookTarget = exports.addStorybookTarget = void 0;
|
|
4
4
|
const devkit_1 = require("@nx/devkit");
|
|
5
5
|
const executor_options_utils_1 = require("@nx/devkit/src/generators/executor-options-utils");
|
|
6
6
|
const eslint_1 = require("@nx/eslint");
|
|
@@ -10,10 +10,7 @@ const versions_1 = require("../../../utils/versions");
|
|
|
10
10
|
const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
|
|
11
11
|
const flat_config_1 = require("@nx/eslint/src/utils/flat-config");
|
|
12
12
|
const DEFAULT_PORT = 4400;
|
|
13
|
-
function
|
|
14
|
-
if (uiFramework === '@storybook/react-native') {
|
|
15
|
-
return;
|
|
16
|
-
}
|
|
13
|
+
function addStorybookTarget(tree, projectName, uiFramework, interactionTests) {
|
|
17
14
|
const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, projectName);
|
|
18
15
|
projectConfig.targets['storybook'] = {
|
|
19
16
|
executor: '@nx/storybook:storybook',
|
|
@@ -50,8 +47,8 @@ function addStorybookTask(tree, projectName, uiFramework, interactionTests) {
|
|
|
50
47
|
}
|
|
51
48
|
(0, devkit_1.updateProjectConfiguration)(tree, projectName, projectConfig);
|
|
52
49
|
}
|
|
53
|
-
exports.
|
|
54
|
-
function
|
|
50
|
+
exports.addStorybookTarget = addStorybookTarget;
|
|
51
|
+
function addAngularStorybookTarget(tree, projectName, interactionTests) {
|
|
55
52
|
const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, projectName);
|
|
56
53
|
const { ngBuildTarget } = (0, utilities_1.findStorybookAndBuildTargetsAndCompiler)(projectConfig.targets);
|
|
57
54
|
projectConfig.targets['storybook'] = {
|
|
@@ -93,21 +90,21 @@ function addAngularStorybookTask(tree, projectName, interactionTests) {
|
|
|
93
90
|
}
|
|
94
91
|
(0, devkit_1.updateProjectConfiguration)(tree, projectName, projectConfig);
|
|
95
92
|
}
|
|
96
|
-
exports.
|
|
97
|
-
function addStaticTarget(tree, opts) {
|
|
98
|
-
const
|
|
99
|
-
|
|
100
|
-
buildTarget: `${opts.
|
|
101
|
-
outputPath: (0, devkit_1.joinPathFragments)('dist/storybook', opts.
|
|
93
|
+
exports.addAngularStorybookTarget = addAngularStorybookTarget;
|
|
94
|
+
async function addStaticTarget(tree, opts) {
|
|
95
|
+
const { webStaticServeGenerator } = (0, devkit_1.ensurePackage)('@nx/web', versions_1.nxVersion);
|
|
96
|
+
await webStaticServeGenerator(tree, {
|
|
97
|
+
buildTarget: `${opts.project}:build-storybook`,
|
|
98
|
+
outputPath: (0, devkit_1.joinPathFragments)('dist/storybook', opts.project),
|
|
102
99
|
targetName: 'static-storybook',
|
|
103
100
|
});
|
|
104
|
-
const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, opts.
|
|
101
|
+
const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, opts.project);
|
|
105
102
|
projectConfig.targets['static-storybook'].configurations = {
|
|
106
103
|
ci: {
|
|
107
|
-
buildTarget: `${opts.
|
|
104
|
+
buildTarget: `${opts.project}:build-storybook:ci`,
|
|
108
105
|
},
|
|
109
106
|
};
|
|
110
|
-
(0, devkit_1.updateProjectConfiguration)(tree, opts.
|
|
107
|
+
(0, devkit_1.updateProjectConfiguration)(tree, opts.project, projectConfig);
|
|
111
108
|
}
|
|
112
109
|
exports.addStaticTarget = addStaticTarget;
|
|
113
110
|
function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProject, mainDir) {
|
|
@@ -152,9 +149,6 @@ function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProje
|
|
|
152
149
|
'.storybook/*.js',
|
|
153
150
|
'.storybook/*.ts',
|
|
154
151
|
];
|
|
155
|
-
if (uiFramework === '@storybook/react-native') {
|
|
156
|
-
include.push('*.ts', '*.tsx');
|
|
157
|
-
}
|
|
158
152
|
const storybookTsConfig = {
|
|
159
153
|
extends: './tsconfig.json',
|
|
160
154
|
compilerOptions: {
|
|
@@ -186,7 +180,7 @@ function editTsconfigBaseJson(tree) {
|
|
|
186
180
|
}
|
|
187
181
|
exports.editTsconfigBaseJson = editTsconfigBaseJson;
|
|
188
182
|
function configureTsProjectConfig(tree, schema) {
|
|
189
|
-
const {
|
|
183
|
+
const { project: projectName } = schema;
|
|
190
184
|
let tsConfigPath;
|
|
191
185
|
let tsConfigContent;
|
|
192
186
|
try {
|
|
@@ -208,8 +202,7 @@ function configureTsProjectConfig(tree, schema) {
|
|
|
208
202
|
...(tsConfigContent.exclude || []),
|
|
209
203
|
'**/*.stories.ts',
|
|
210
204
|
'**/*.stories.js',
|
|
211
|
-
...(schema.uiFramework
|
|
212
|
-
schema.uiFramework?.startsWith('@storybook/react')
|
|
205
|
+
...(schema.uiFramework?.startsWith('@storybook/react')
|
|
213
206
|
? ['**/*.stories.jsx', '**/*.stories.tsx']
|
|
214
207
|
: []),
|
|
215
208
|
];
|
|
@@ -218,7 +211,7 @@ function configureTsProjectConfig(tree, schema) {
|
|
|
218
211
|
}
|
|
219
212
|
exports.configureTsProjectConfig = configureTsProjectConfig;
|
|
220
213
|
function configureTsSolutionConfig(tree, schema) {
|
|
221
|
-
const {
|
|
214
|
+
const { project: projectName } = schema;
|
|
222
215
|
const { root } = (0, devkit_1.readProjectConfiguration)(tree, projectName);
|
|
223
216
|
const tsConfigPath = (0, path_1.join)(root, 'tsconfig.json');
|
|
224
217
|
const tsConfigContent = (0, devkit_1.readJson)(tree, tsConfigPath);
|
|
@@ -257,7 +250,7 @@ exports.configureTsSolutionConfig = configureTsSolutionConfig;
|
|
|
257
250
|
* This is done within the eslint config file.
|
|
258
251
|
*/
|
|
259
252
|
function updateLintConfig(tree, schema) {
|
|
260
|
-
const {
|
|
253
|
+
const { project: projectName } = schema;
|
|
261
254
|
const { root } = (0, devkit_1.readProjectConfiguration)(tree, projectName);
|
|
262
255
|
const eslintFile = (0, eslint_file_1.findEslintFile)(tree, root);
|
|
263
256
|
if (!eslintFile) {
|
|
@@ -306,6 +299,10 @@ function updateLintConfig(tree, schema) {
|
|
|
306
299
|
]);
|
|
307
300
|
}
|
|
308
301
|
}
|
|
302
|
+
const ignorePatterns = json.ignorePatterns || [];
|
|
303
|
+
if (!ignorePatterns.includes('storybook-static')) {
|
|
304
|
+
ignorePatterns.push('storybook-static');
|
|
305
|
+
}
|
|
309
306
|
return json;
|
|
310
307
|
});
|
|
311
308
|
}
|
|
@@ -338,29 +335,39 @@ function addStorybookToNamedInputs(tree) {
|
|
|
338
335
|
nxJson.namedInputs.production.push('!{projectRoot}/tsconfig.storybook.json');
|
|
339
336
|
}
|
|
340
337
|
}
|
|
341
|
-
nxJson.targetDefaults ??= {};
|
|
342
|
-
nxJson.targetDefaults['build-storybook'] ??= {};
|
|
343
|
-
nxJson.targetDefaults['build-storybook'].inputs ??= [
|
|
344
|
-
'default',
|
|
345
|
-
hasProductionFileset ? '^production' : '^default',
|
|
346
|
-
];
|
|
347
|
-
if (!nxJson.targetDefaults['build-storybook'].inputs.includes('{projectRoot}/.storybook/**/*')) {
|
|
348
|
-
nxJson.targetDefaults['build-storybook'].inputs.push('{projectRoot}/.storybook/**/*');
|
|
349
|
-
}
|
|
350
|
-
// Delete the !{projectRoot}/.storybook/**/* glob from build-storybook
|
|
351
|
-
// because we want to rebuild Storybook if the .storybook folder changes
|
|
352
|
-
const index = nxJson.targetDefaults['build-storybook'].inputs.indexOf('!{projectRoot}/.storybook/**/*');
|
|
353
|
-
if (index !== -1) {
|
|
354
|
-
nxJson.targetDefaults['build-storybook'].inputs.splice(index, 1);
|
|
355
|
-
}
|
|
356
|
-
if (!nxJson.targetDefaults['build-storybook'].inputs.includes('{projectRoot}/tsconfig.storybook.json')) {
|
|
357
|
-
nxJson.targetDefaults['build-storybook'].inputs.push('{projectRoot}/tsconfig.storybook.json');
|
|
358
|
-
}
|
|
359
338
|
(0, devkit_1.updateNxJson)(tree, nxJson);
|
|
360
339
|
}
|
|
361
340
|
}
|
|
362
341
|
exports.addStorybookToNamedInputs = addStorybookToNamedInputs;
|
|
363
|
-
function
|
|
342
|
+
function addStorybookToTargetDefaults(tree, setCache = true) {
|
|
343
|
+
const nxJson = (0, devkit_1.readNxJson)(tree);
|
|
344
|
+
nxJson.targetDefaults ??= {};
|
|
345
|
+
nxJson.targetDefaults['build-storybook'] ??= {};
|
|
346
|
+
if (setCache) {
|
|
347
|
+
nxJson.targetDefaults['build-storybook'].cache ??= true;
|
|
348
|
+
}
|
|
349
|
+
nxJson.targetDefaults['build-storybook'].inputs ??= [
|
|
350
|
+
'default',
|
|
351
|
+
nxJson.namedInputs && 'production' in nxJson.namedInputs
|
|
352
|
+
? '^production'
|
|
353
|
+
: '^default',
|
|
354
|
+
];
|
|
355
|
+
if (!nxJson.targetDefaults['build-storybook'].inputs.includes('{projectRoot}/.storybook/**/*')) {
|
|
356
|
+
nxJson.targetDefaults['build-storybook'].inputs.push('{projectRoot}/.storybook/**/*');
|
|
357
|
+
}
|
|
358
|
+
// Delete the !{projectRoot}/.storybook/**/* glob from build-storybook
|
|
359
|
+
// because we want to rebuild Storybook if the .storybook folder changes
|
|
360
|
+
const index = nxJson.targetDefaults['build-storybook'].inputs.indexOf('!{projectRoot}/.storybook/**/*');
|
|
361
|
+
if (index !== -1) {
|
|
362
|
+
nxJson.targetDefaults['build-storybook'].inputs.splice(index, 1);
|
|
363
|
+
}
|
|
364
|
+
if (!nxJson.targetDefaults['build-storybook'].inputs.includes('{projectRoot}/tsconfig.storybook.json')) {
|
|
365
|
+
nxJson.targetDefaults['build-storybook'].inputs.push('{projectRoot}/tsconfig.storybook.json');
|
|
366
|
+
}
|
|
367
|
+
(0, devkit_1.updateNxJson)(tree, nxJson);
|
|
368
|
+
}
|
|
369
|
+
exports.addStorybookToTargetDefaults = addStorybookToTargetDefaults;
|
|
370
|
+
function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfiguration, root, projectType, projectIsRootProjectInStandaloneWorkspace, interactionTests, mainDir, isNextJs, usesSwc, usesVite, viteConfigFilePath, hasPlugin, viteConfigFileName, useReactNative) {
|
|
364
371
|
let projectDirectory = projectType === 'application'
|
|
365
372
|
? isNextJs
|
|
366
373
|
? 'components'
|
|
@@ -391,6 +398,9 @@ function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfigu
|
|
|
391
398
|
usesVite,
|
|
392
399
|
isRootProject: projectIsRootProjectInStandaloneWorkspace,
|
|
393
400
|
viteConfigFilePath,
|
|
401
|
+
hasPlugin,
|
|
402
|
+
viteConfigFileName,
|
|
403
|
+
useReactNative,
|
|
394
404
|
});
|
|
395
405
|
if (js) {
|
|
396
406
|
(0, devkit_1.toJS)(tree);
|
|
@@ -416,23 +426,12 @@ function getTsConfigPath(tree, projectName, path) {
|
|
|
416
426
|
}
|
|
417
427
|
exports.getTsConfigPath = getTsConfigPath;
|
|
418
428
|
function addBuildStorybookToCacheableOperations(tree) {
|
|
419
|
-
(0, devkit_1.
|
|
420
|
-
|
|
421
|
-
tasksRunnerOptions
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
options: {
|
|
426
|
-
...(json.tasksRunnerOptions?.default?.options ?? {}),
|
|
427
|
-
cacheableOperations: Array.from(new Set([
|
|
428
|
-
...(json.tasksRunnerOptions?.default?.options
|
|
429
|
-
?.cacheableOperations ?? []),
|
|
430
|
-
'build-storybook',
|
|
431
|
-
])),
|
|
432
|
-
},
|
|
433
|
-
},
|
|
434
|
-
},
|
|
435
|
-
}));
|
|
429
|
+
const nxJson = (0, devkit_1.readNxJson)(tree);
|
|
430
|
+
if (nxJson.tasksRunnerOptions?.default?.options?.cacheableOperations &&
|
|
431
|
+
!nxJson.tasksRunnerOptions.default.options.cacheableOperations.includes('build-storybook')) {
|
|
432
|
+
nxJson.tasksRunnerOptions.default.options.cacheableOperations.push('build-storybook');
|
|
433
|
+
(0, devkit_1.updateNxJson)(tree, nxJson);
|
|
434
|
+
}
|
|
436
435
|
}
|
|
437
436
|
exports.addBuildStorybookToCacheableOperations = addBuildStorybookToCacheableOperations;
|
|
438
437
|
function projectIsRootProjectInStandaloneWorkspace(projectRoot) {
|
|
@@ -479,16 +478,36 @@ async function getE2EProjectName(tree, mainProject) {
|
|
|
479
478
|
return e2eProject;
|
|
480
479
|
}
|
|
481
480
|
exports.getE2EProjectName = getE2EProjectName;
|
|
482
|
-
function
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
:
|
|
481
|
+
function findViteConfig(tree, projectRoot) {
|
|
482
|
+
const allowsExt = ['js', 'mjs', 'ts', 'cjs', 'mts', 'cts'];
|
|
483
|
+
for (const ext of allowsExt) {
|
|
484
|
+
const viteConfigPath = (0, devkit_1.joinPathFragments)(projectRoot, `vite.config.${ext}`);
|
|
485
|
+
if (tree.exists(viteConfigPath)) {
|
|
486
|
+
return {
|
|
487
|
+
fullConfigPath: viteConfigPath,
|
|
488
|
+
viteConfigFileName: `vite.config.${ext}`,
|
|
489
|
+
};
|
|
490
|
+
}
|
|
491
|
+
}
|
|
492
|
+
}
|
|
493
|
+
exports.findViteConfig = findViteConfig;
|
|
494
|
+
function findNextConfig(tree, projectRoot) {
|
|
495
|
+
const allowsExt = ['js', 'mjs', 'cjs'];
|
|
496
|
+
for (const ext of allowsExt) {
|
|
497
|
+
const nextConfigPath = (0, devkit_1.joinPathFragments)(projectRoot, `next.config.${ext}`);
|
|
498
|
+
if (tree.exists(nextConfigPath)) {
|
|
499
|
+
return nextConfigPath;
|
|
500
|
+
}
|
|
501
|
+
}
|
|
502
|
+
}
|
|
503
|
+
exports.findNextConfig = findNextConfig;
|
|
504
|
+
function findMetroConfig(tree, projectRoot) {
|
|
505
|
+
const nextConfigPath = (0, devkit_1.joinPathFragments)(projectRoot, `metro.config.js`);
|
|
506
|
+
if (tree.exists(nextConfigPath)) {
|
|
507
|
+
return nextConfigPath;
|
|
508
|
+
}
|
|
490
509
|
}
|
|
491
|
-
exports.
|
|
510
|
+
exports.findMetroConfig = findMetroConfig;
|
|
492
511
|
function renameAndMoveOldTsConfig(projectRoot, pathToStorybookConfigFile, tree) {
|
|
493
512
|
if (pathToStorybookConfigFile && tree.exists(pathToStorybookConfigFile)) {
|
|
494
513
|
(0, devkit_1.updateJson)(tree, pathToStorybookConfigFile, (json) => {
|
|
@@ -9,18 +9,38 @@ const config = {
|
|
|
9
9
|
'../**/*.stories.@(js|jsx|ts|tsx|mdx)' <% } else { %>
|
|
10
10
|
'../<%= projectDirectory %>/**/*.stories.@(js|jsx|ts|tsx|mdx)'
|
|
11
11
|
<% } %>],
|
|
12
|
-
addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% }
|
|
12
|
+
addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
|
|
13
13
|
framework: {
|
|
14
14
|
name: '<%= uiFramework %>',
|
|
15
15
|
options: {
|
|
16
|
-
|
|
16
|
+
<% if (usesVite && viteConfigFilePath && hasPlugin) { %>
|
|
17
|
+
builder: {
|
|
18
|
+
viteConfigPath: '<%= viteConfigFileName %>',
|
|
19
|
+
},
|
|
20
|
+
<% } %>
|
|
21
|
+
<% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
|
|
17
22
|
builder: {
|
|
18
23
|
viteConfigPath: '<%= viteConfigFilePath %>',
|
|
19
24
|
},
|
|
20
25
|
<% } %>
|
|
21
26
|
},
|
|
22
27
|
},
|
|
23
|
-
<% if (
|
|
28
|
+
<% if (useReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
|
|
29
|
+
if (config.resolve) {
|
|
30
|
+
config.resolve.alias = {
|
|
31
|
+
...config.resolve.alias,
|
|
32
|
+
'react-native$': 'react-native-web',
|
|
33
|
+
};
|
|
34
|
+
config.resolve.extensions = [
|
|
35
|
+
'.web.tsx',
|
|
36
|
+
'.web.ts',
|
|
37
|
+
'.web.jsx',
|
|
38
|
+
'.web.js',
|
|
39
|
+
...(config.resolve.extensions ?? []),
|
|
40
|
+
];
|
|
41
|
+
}
|
|
42
|
+
return config;
|
|
43
|
+
},<% } %><% if (usesVite && !viteConfigFilePath) { %>
|
|
24
44
|
viteFinal: async (config) =>
|
|
25
45
|
mergeConfig(config, {
|
|
26
46
|
plugins: [nxViteTsPaths()],
|
|
@@ -10,18 +10,37 @@ const config: StorybookConfig = {
|
|
|
10
10
|
'../**/*.stories.@(js|jsx|ts|tsx|mdx)' <% } else { %>
|
|
11
11
|
'../<%= projectDirectory %>/**/*.stories.@(js|jsx|ts|tsx|mdx)'
|
|
12
12
|
<% } %>],
|
|
13
|
-
addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% }
|
|
13
|
+
addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
|
|
14
14
|
framework: {
|
|
15
15
|
name: '<%= uiFramework %>',
|
|
16
16
|
options: {
|
|
17
|
-
<% if (usesVite && viteConfigFilePath) { %>
|
|
17
|
+
<% if (usesVite && viteConfigFilePath && hasPlugin) { %>
|
|
18
|
+
builder: {
|
|
19
|
+
viteConfigPath: '<%= viteConfigFileName %>',
|
|
20
|
+
},
|
|
21
|
+
<% } %><% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
|
|
18
22
|
builder: {
|
|
19
23
|
viteConfigPath: '<%= viteConfigFilePath %>',
|
|
20
24
|
},
|
|
21
25
|
<% } %>
|
|
22
26
|
},
|
|
23
27
|
},
|
|
24
|
-
<% if (
|
|
28
|
+
<% if (useReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
|
|
29
|
+
if (config.resolve) {
|
|
30
|
+
config.resolve.alias = {
|
|
31
|
+
...config.resolve.alias,
|
|
32
|
+
'react-native$': 'react-native-web',
|
|
33
|
+
};
|
|
34
|
+
config.resolve.extensions = [
|
|
35
|
+
'.web.tsx',
|
|
36
|
+
'.web.ts',
|
|
37
|
+
'.web.jsx',
|
|
38
|
+
'.web.js',
|
|
39
|
+
...(config.resolve.extensions ?? []),
|
|
40
|
+
];
|
|
41
|
+
}
|
|
42
|
+
return config;
|
|
43
|
+
},<% } %><% if (usesVite && !viteConfigFilePath) { %>
|
|
25
44
|
viteFinal: async (config) =>
|
|
26
45
|
mergeConfig(config, {
|
|
27
46
|
plugins: [nxViteTsPaths()],
|
|
@@ -2,7 +2,7 @@ import { Linter } from '@nx/eslint';
|
|
|
2
2
|
import { UiFramework } from '../../utils/models';
|
|
3
3
|
|
|
4
4
|
export interface StorybookConfigureSchema {
|
|
5
|
-
|
|
5
|
+
project: string;
|
|
6
6
|
uiFramework?: UiFramework;
|
|
7
7
|
linter?: Linter;
|
|
8
8
|
js?: boolean;
|
|
@@ -12,11 +12,17 @@ export interface StorybookConfigureSchema {
|
|
|
12
12
|
configureStaticServe?: boolean;
|
|
13
13
|
skipFormat?: boolean;
|
|
14
14
|
/**
|
|
15
|
-
* @deprecated Use interactionTests instead. This option will be removed in
|
|
15
|
+
* @deprecated Use interactionTests instead. This option will be removed in v19.
|
|
16
16
|
*/
|
|
17
17
|
configureCypress?: boolean;
|
|
18
18
|
/**
|
|
19
|
-
* @deprecated Use interactionTests instead. This option will be removed in
|
|
19
|
+
* @deprecated Use interactionTests instead. This option will be removed in v19.
|
|
20
20
|
*/
|
|
21
21
|
cypressDirectory?: string;
|
|
22
|
+
addPlugin?: boolean;
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* @internal
|
|
26
|
+
*/
|
|
27
|
+
addExplicitTargets?: boolean;
|
|
22
28
|
}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
|
-
"$schema": "
|
|
2
|
+
"$schema": "https://json-schema.org/schema",
|
|
3
3
|
"cli": "nx",
|
|
4
4
|
"$id": "NxStorybookConfigure",
|
|
5
5
|
"title": "Storybook Configuration",
|
|
6
6
|
"description": "Add Storybook configuration to a UI library or an application.",
|
|
7
7
|
"type": "object",
|
|
8
8
|
"properties": {
|
|
9
|
-
"
|
|
9
|
+
"project": {
|
|
10
10
|
"type": "string",
|
|
11
|
-
"aliases": ["
|
|
11
|
+
"aliases": ["name", "projectName"],
|
|
12
12
|
"description": "Project for which to generate Storybook configuration.",
|
|
13
13
|
"$default": {
|
|
14
14
|
"$source": "argv",
|
|
@@ -28,12 +28,12 @@
|
|
|
28
28
|
"configureCypress": {
|
|
29
29
|
"type": "boolean",
|
|
30
30
|
"description": "Run the cypress-configure generator.",
|
|
31
|
-
"x-deprecated": "Use interactionTests instead. This option will be removed in
|
|
31
|
+
"x-deprecated": "Use interactionTests instead. This option will be removed in v19."
|
|
32
32
|
},
|
|
33
33
|
"cypressDirectory": {
|
|
34
34
|
"type": "string",
|
|
35
35
|
"description": "A directory where the Cypress project will be placed. Added at root by default.",
|
|
36
|
-
"x-deprecated": "Use interactionTests instead. This option will be removed in
|
|
36
|
+
"x-deprecated": "Use interactionTests instead. This option will be removed in v19."
|
|
37
37
|
},
|
|
38
38
|
"linter": {
|
|
39
39
|
"description": "The tool to use for running lint checks.",
|
|
@@ -63,13 +63,6 @@
|
|
|
63
63
|
"description": "Add a static-storybook to serve the static storybook built files.",
|
|
64
64
|
"default": false
|
|
65
65
|
},
|
|
66
|
-
"bundler": {
|
|
67
|
-
"description": "The Storybook builder to use.",
|
|
68
|
-
"type": "string",
|
|
69
|
-
"enum": ["vite", "webpack"],
|
|
70
|
-
"default": "webpack",
|
|
71
|
-
"x-priority": "important"
|
|
72
|
-
},
|
|
73
66
|
"uiFramework": {
|
|
74
67
|
"type": "string",
|
|
75
68
|
"description": "Storybook UI Framework to use.",
|
|
@@ -103,6 +96,6 @@
|
|
|
103
96
|
"x-priority": "internal"
|
|
104
97
|
}
|
|
105
98
|
},
|
|
106
|
-
"required": ["
|
|
99
|
+
"required": ["project", "uiFramework"],
|
|
107
100
|
"examplesFile": "../../../docs/configuration-generator-examples.md"
|
|
108
101
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Tree } from '@nx/devkit';
|
|
2
2
|
import { Linter } from '@nx/eslint';
|
|
3
3
|
export interface CypressConfigureSchema {
|
|
4
4
|
name: string;
|
|
@@ -10,6 +10,6 @@ export interface CypressConfigureSchema {
|
|
|
10
10
|
skipFormat?: boolean;
|
|
11
11
|
projectNameAndRootFormat?: 'as-provided' | 'derived';
|
|
12
12
|
}
|
|
13
|
-
export declare function cypressProjectGenerator(tree: Tree, schema: CypressConfigureSchema): Promise<GeneratorCallback>;
|
|
14
|
-
export declare function cypressProjectGeneratorInternal(tree: Tree, schema: CypressConfigureSchema): Promise<GeneratorCallback>;
|
|
13
|
+
export declare function cypressProjectGenerator(tree: Tree, schema: CypressConfigureSchema): Promise<import("@nx/devkit").GeneratorCallback>;
|
|
14
|
+
export declare function cypressProjectGeneratorInternal(tree: Tree, schema: CypressConfigureSchema): Promise<import("@nx/devkit").GeneratorCallback>;
|
|
15
15
|
export default cypressProjectGenerator;
|
|
@@ -15,7 +15,7 @@ async function cypressProjectGenerator(tree, schema) {
|
|
|
15
15
|
}
|
|
16
16
|
exports.cypressProjectGenerator = cypressProjectGenerator;
|
|
17
17
|
async function cypressProjectGeneratorInternal(tree, schema) {
|
|
18
|
-
const { configurationGenerator
|
|
18
|
+
const { configurationGenerator } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
|
|
19
19
|
const e2eName = schema.name ? `${schema.name}-e2e` : undefined;
|
|
20
20
|
const { projectName, projectRoot } = await (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(tree, {
|
|
21
21
|
name: e2eName,
|
|
@@ -26,10 +26,6 @@ async function cypressProjectGeneratorInternal(tree, schema) {
|
|
|
26
26
|
});
|
|
27
27
|
const libConfig = (0, devkit_1.readProjectConfiguration)(tree, schema.name);
|
|
28
28
|
const libRoot = libConfig.root;
|
|
29
|
-
const tasks = [];
|
|
30
|
-
if (!projectAlreadyHasCypress(tree)) {
|
|
31
|
-
tasks.push(await cypressInitGenerator(tree, {}));
|
|
32
|
-
}
|
|
33
29
|
(0, devkit_1.addProjectConfiguration)(tree, projectName, {
|
|
34
30
|
root: projectRoot,
|
|
35
31
|
projectType: 'application',
|
|
@@ -37,7 +33,7 @@ async function cypressProjectGeneratorInternal(tree, schema) {
|
|
|
37
33
|
targets: {},
|
|
38
34
|
implicitDependencies: [projectName],
|
|
39
35
|
});
|
|
40
|
-
const
|
|
36
|
+
const cypressTask = await configurationGenerator(tree, {
|
|
41
37
|
project: projectName,
|
|
42
38
|
js: schema.js,
|
|
43
39
|
linter: schema.linter,
|
|
@@ -45,7 +41,6 @@ async function cypressProjectGeneratorInternal(tree, schema) {
|
|
|
45
41
|
devServerTarget: `${schema.name}:storybook`,
|
|
46
42
|
skipFormat: true,
|
|
47
43
|
});
|
|
48
|
-
tasks.push(installTask);
|
|
49
44
|
const generatedCypressProjectName = (0, project_name_1.getE2eProjectName)(schema.name, libRoot, schema.directory);
|
|
50
45
|
removeUnneededFiles(tree, generatedCypressProjectName, schema.js);
|
|
51
46
|
addBaseUrlToCypressConfig(tree, generatedCypressProjectName);
|
|
@@ -57,7 +52,7 @@ async function cypressProjectGeneratorInternal(tree, schema) {
|
|
|
57
52
|
if (!schema.skipFormat) {
|
|
58
53
|
await (0, devkit_1.formatFiles)(tree);
|
|
59
54
|
}
|
|
60
|
-
return
|
|
55
|
+
return cypressTask;
|
|
61
56
|
}
|
|
62
57
|
exports.cypressProjectGeneratorInternal = cypressProjectGeneratorInternal;
|
|
63
58
|
function removeUnneededFiles(tree, projectName, js) {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { GeneratorCallback, Tree } from '@nx/devkit';
|
|
2
2
|
import { Schema } from './schema';
|
|
3
3
|
export declare function initGenerator(tree: Tree, schema: Schema): Promise<GeneratorCallback>;
|
|
4
|
+
export declare function initGeneratorInternal(tree: Tree, schema: Schema): Promise<GeneratorCallback>;
|
|
4
5
|
export default initGenerator;
|