Skip to content

Commit

Permalink
feat(storybook): choose to generate ts config
Browse files Browse the repository at this point in the history
ISSUES CLOSED: nrwl#10394
  • Loading branch information
mandarini committed Jun 3, 2022
1 parent 62b55d4 commit b620acf
Show file tree
Hide file tree
Showing 14 changed files with 109 additions and 6 deletions.
7 changes: 6 additions & 1 deletion docs/generated/packages/react-native.json
Original file line number Diff line number Diff line change
Expand Up @@ -355,7 +355,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"linter": {
Expand Down
7 changes: 6 additions & 1 deletion docs/generated/packages/react.json
Original file line number Diff line number Diff line change
Expand Up @@ -625,7 +625,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"linter": {
Expand Down
7 changes: 6 additions & 1 deletion docs/generated/packages/storybook.json
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"standaloneConfig": {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ export interface StorybookConfigureSchema {
name: string;
generateStories?: boolean;
js?: boolean;
tsConfiguration?: boolean;
linter?: Linter;
standaloneConfig?: boolean;
}
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"linter": {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ export interface StorybookConfigureSchema {
generateStories?: boolean;
generateCypressSpecs?: boolean;
js?: boolean;
tsConfiguration?: boolean;
linter?: Linter;
cypressDirectory?: string;
standaloneConfig?: boolean;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"linter": {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
const rootMain = require('<%= offsetFromRoot %>../.storybook/main');
<% if (existsRootWebpackConfig){ %>const rootWebpackConfig = require('<%= offsetFromRoot %>../.storybook/webpack.config'); <% } %>

module.exports = {
...rootMain,
<% if (useWebpack5) { %>
core: { ...rootMain.core, builder: 'webpack5' },
<% } %>
stories: [
...rootMain.stories,
'../src/<%= projectType %>/**/*.stories.mdx',
'../src/<%= projectType %>/**/*.stories.@(js|jsx|ts|tsx)'
],
addons: [...rootMain.addons <% if(uiFramework === '@storybook/react') { %>, '@nrwl/react/plugins/storybook' <% } %><% if(uiFramework === '@storybook/react-native') { %>, '@storybook/addon-ondevice-actions', '@storybook/addon-ondevice-backgrounds', '@storybook/addon-ondevice-controls', '@storybook/addon-ondevice-notes' <% } %>],
webpackFinal: async (config, { configType }) => {
// apply any global webpack configs that might have been specified in .storybook/main.js
if (rootMain.webpackFinal) {
config = await rootMain.webpackFinal(config, { configType });
}

<% if (existsRootWebpackConfig) { %>// for backwards compatibility call the `rootWebpackConfig`
// this can be removed once that one is migrated fully to
// use the `webpackFinal` property in the `main.js` file
config = rootWebpackConfig({ config });
<% } %>

// add your own webpack tweaks if needed

return config;
},
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"emitDecoratorMetadata": true
<% if(uiFramework === '@storybook/react') { %>, "outDir": "" <% } %>
},
<% if(uiFramework === '@storybook/react') { %>"files": [
"<%= offsetFromRoot %>../node_modules/@nrwl/react/typings/styled-jsx.d.ts",
"<%= offsetFromRoot %>../node_modules/@nrwl/react/typings/cssmodule.d.ts",
"<%= offsetFromRoot %>../node_modules/@nrwl/react/typings/image.d.ts"
],<% } %>
"exclude": ["../**/*.spec.ts" <% if(uiFramework === '@storybook/react') { %>, "../**/*.spec.js", "../**/*.spec.tsx", "../**/*.spec.jsx"<% } %>],
"include": ["../src/**/*", "*.js" <% if(uiFramework === '@storybook/react-native') { %>, "*.ts", "*.tsx"<% } %>]
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
module.exports = {
stories: [],
addons: ['@storybook/addon-essentials'],
// uncomment the property below if you want to apply some webpack config globally
// webpackFinal: async (config, { configType }) => {
// // Make whatever fine-grained changes you need that should apply to all storybook configs

// // Return the altered config
// return config;
// },
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"extends": "../<%= rootTsConfigPath %>",
"exclude": [
"../**/*.spec.js",
"../**/*.test.js",
"../**/*.spec.ts",
"../**/*.test.ts",
"../**/*.spec.tsx",
"../**/*.test.tsx",
"../**/*.spec.jsx",
"../**/*.test.jsx"
],
"include": ["../**/*"]
}
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ export interface StorybookConfigureSchema {
configureCypress?: boolean;
linter?: Linter;
js?: boolean;
tsConfiguration?: boolean;
cypressDirectory?: string;
standaloneConfig?: boolean;
projectBuildConfig?: string;
Expand Down
7 changes: 6 additions & 1 deletion packages/storybook/src/generators/configuration/schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,12 @@
},
"js": {
"type": "boolean",
"description": "Generate JavaScript files rather than TypeScript files.",
"description": "Generate JavaScript story files rather than TypeScript story files.",
"default": false
},
"tsConfiguration": {
"type": "boolean",
"description": "Configure your project with TypeScript. Generate main.ts and preview.ts files, instead of main.js and preview.js.",
"default": false
},
"standaloneConfig": {
Expand Down

0 comments on commit b620acf

Please sign in to comment.