diff --git a/client/package.json b/client/package.json index 4a3527a..06a44e3 100644 --- a/client/package.json +++ b/client/package.json @@ -45,9 +45,13 @@ }, "devDependencies": { "@babel/core": "7.2.2", + "@storybook/addon-actions": "4.1.11", + "@storybook/addon-links": "4.1.11", + "@storybook/addon-notes": "4.1.11", "@storybook/addon-storysource": "4.1.11", "@storybook/addons": "4.1.11", "@storybook/react": "4.1.11", + "@types/storybook__addon-links": "3.3.3", "@types/storybook__react": "4.0.0", "babel-loader": "8.0.5", "css-loader": "2.1.0", diff --git a/client/src/.storybook/addons.js b/client/src/.storybook/addons.js index b94b37f..18dbddc 100644 --- a/client/src/.storybook/addons.js +++ b/client/src/.storybook/addons.js @@ -1 +1,4 @@ import '@storybook/addon-storysource/register' +import '@storybook/addon-actions/register' +import '@storybook/addon-links/register' +import '@storybook/addon-notes/register' diff --git a/client/src/.storybook/config.js b/client/src/.storybook/config.js index 1a6115a..23cfd74 100644 --- a/client/src/.storybook/config.js +++ b/client/src/.storybook/config.js @@ -2,7 +2,6 @@ import { configure } from '@storybook/react' // storyファイルを一括取得 const req = require.context("../components", true, /.stories.(ts|tsx)$/) - function loadStories() { req.keys().forEach((filename) => req(filename)) } diff --git a/client/src/.storybook/webpack.config.js b/client/src/.storybook/webpack.config.js index 5bba5c4..0e8f75f 100644 --- a/client/src/.storybook/webpack.config.js +++ b/client/src/.storybook/webpack.config.js @@ -3,21 +3,21 @@ const path = require("path") module.exports = (baseConfig, env, defaultConfig) => { defaultConfig.module.rules.push({ test: /\.(ts|tsx)$/, - include: path.resolve(__dirname, '../components'), - loader: require.resolve("ts-loader") - }); + include: path.resolve(__dirname, '../'), + loader: require.resolve("ts-loader"), + }) - // addon-storysource使うときだけ defaultConfig.module.rules.push({ - test: /\.stories\.jsx?$/, + test: /\.stories\.tsx$/, loaders: [ { loader: require.resolve("@storybook/addon-storysource/loader"), - options: { parser: "typescript" } + options: { parser: "typescript" }, } ], - enforce: "pre" - }); + enforce: "pre", + }) + defaultConfig.resolve.extensions.push(".ts", ".tsx") return defaultConfig diff --git a/client/src/app.tsx b/client/src/app.tsx index f4f44d3..65251fc 100644 --- a/client/src/app.tsx +++ b/client/src/app.tsx @@ -7,7 +7,7 @@ import reducers from './reducers' import thunk from 'redux-thunk' import axios from 'axios' -import Hello from './components/Hello' +import TopPage from './components/pages/TopPage' import Auth from './components/utils/auth' import { ROOT_URL } from './constants' @@ -18,7 +18,7 @@ ReactDOM.render( - +

404 Not Found

} /> diff --git a/client/src/components/Hello.tsx b/client/src/components/Hello.tsx deleted file mode 100644 index d276bc3..0000000 --- a/client/src/components/Hello.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import * as React from 'react' - -import TopPage from './pages/TopPage' - -const Hello = () => - -export default Hello diff --git a/client/src/components/atoms/Button/index.stories.tsx b/client/src/components/atoms/Button/index.stories.tsx index 147ffdf..f55e3c7 100644 --- a/client/src/components/atoms/Button/index.stories.tsx +++ b/client/src/components/atoms/Button/index.stories.tsx @@ -3,11 +3,15 @@ import { storiesOf } from '@storybook/react' import Button from './index' storiesOf('Button', module) - .add('normal', () => ( - - )) + .add( + 'normal', + () => ( + + ), + { notes: 'This is a first note for Fortuna(test).' } + ) .add('primary', () => (