Ошибка машинописи в Storybook 3.4.6 с использованием ts-loader - PullRequest
0 голосов
/ 07 июня 2018

Я пытаюсь запустить Storybook 3.4.6 с Typescript.В настоящее время я пытаюсь заставить его работать, используя ts-loader.Всякий раз, когда я пытаюсь запустить yarn storybook, я получаю сообщение об ошибке:

Module build failed: TypeError: Cannot read property 'afterCompile' 
of undefined at successfulTypeScriptInstance

Некоторая информация о моей настройке:

.storybook / config.js

...
function loadStories() {
    const req = require.context('../src', true, /^.*\.stories\.tsx$/)
    req.keys().forEach(filename => req(filename))
}
...

.storybook / webpack.config.js

const path = require("path");
const TSDocgenPlugin = require("react-docgen-typescript-webpack-plugin");
module.exports = (baseConfig, env, config) => {
    config.module.rules.push({
        test: /\.(ts|tsx)$/,
        loader: require.resolve("ts-loader")
    });
    config.plugins.push(new TSDocgenPlugin()); // optional
    config.resolve.extensions.push(".ts", ".tsx");
    return config;
};

Структура папок

├── .storybook
└── src
    └── components
        └── Button
            ├── Button.tsx
            └── Button.stories.tsx

Версия сборника рассказови затронутые аддоны

"@storybook/addon-actions": "^3.4.6",
"@storybook/addon-info": "^3.4.6",
"@storybook/addon-links": "^3.4.6",
"@storybook/react": "^3.4.6",
"react-docgen-typescript-webpack-plugin": "^1.1.0",
"ts-loader": "^4.0.0",
"tslint": "^5.9.1",
"typescript": "^2.9.1",
"webpack": "^4.11.1",       
"webpack-cli": "^2.1.3"

Снимок экрана: screen shot 2018-06-07 at 09 22 03

1 Ответ

0 голосов
/ 07 июня 2018

Оказывается Storybook v3.4.6.поддерживает только Webpack 3. Итак, чтобы использовать Webpack 4, я обновил Storybook до версии 4 (alpha), и это решило мою проблему.

    "@storybook/addon-actions": "^3.4.6",
    "@storybook/addon-info": "^3.4.6",
    "@storybook/addon-links": "^3.4.6",
    "@storybook/addons": "^3.4.6",
    "@storybook/react": "4.0.0-alpha.8",
    "ts-loader": "^4.3.1",
    "tslint": "^5.9.1",
    "typescript": "^2.9.1",
    "webpack": "^4.11.1",
    "webpack-cli": "^2.1.3"
...