Jelaskan bugnya
Buku cerita yang dibuat secara otomatis dengan @storybook/source-loader
mencetak pesan kesalahan ini dan sumber tidak dimuat, dan tidak ada tab 'Cerita' yang muncul.
Untuk Mereproduksi
Demo Repo : https://github.com/petermikitsh/sb-source-error (jalankan saja yarn start-storybook
)
Langkah-langkah untuk mereproduksi perilaku:
npx init storybook # choose react
npm i @storybook/source-loader --dev
.storybook / main.js:
module.exports = {
stories: [
"../stories/**/*.stories.mdx",
"../stories/**/*.stories.@(js|jsx|ts|tsx)",
],
addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
+ "@storybook/source-loader",
],
+ webpackFinal: async (config) => {
+ config.module.rules = [
+ ...config.module.rules,
+ {
+ test: /\.stories\.jsx?$/,
+ loaders: [
+ {
+ loader: require.resolve("@storybook/source-loader"),
+ options: { parser: "javascript" },
+ },
+ ],
+ enforce: "pre",
+ },
+ ];
+ return config;
+ },
};
info @storybook/react v6.0.5
info
info => Loading presets
WARN Failed to load preset: {"name":"@storybook/source-loader","type":"presets"} on level 1
ERR! TypeError: Cannot read property 'query' of undefined
ERR! at getOptions (/[REDACTED]/node_modules/loader-utils/lib/getOptions.js:6:31)
ERR! at readAsObject (/[REDACTED]/node_modules/@storybook/source-loader/dist/dependencies-lookup/readAsObject.js:25:45)
Perilaku yang diharapkan
Tidak ada kesalahan, kode sumber cerita dimuat.
Screenshot
Maafkan saya-- Saya mungkin telah salah membaca dokumentasinya. Saya pikir konfigurasi saya yang tercantum di atas tidak benar. Saya telah memperbarui konfigurasi saya. Sebagian besar cerita saya sekarang diisi dengan kode sumber.
Addons harus seperti ini:
addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
+ "@storybook/addon-storysource",
],
@storybook/addon-storysource
menggunakan @storybook/source-loader
bawah tenda. Jika Anda mengganti konfigurasi webpack (misalnya, mendefinisikan array config.module.rules
Anda sendiri, Anda harus mengatur sendiri @storybook/source-loader
.
Komentar yang paling membantu
Maafkan saya-- Saya mungkin telah salah membaca dokumentasinya. Saya pikir konfigurasi saya yang tercantum di atas tidak benar. Saya telah memperbarui konfigurasi saya. Sebagian besar cerita saya sekarang diisi dengan kode sumber.
Addons harus seperti ini:
@storybook/addon-storysource
menggunakan@storybook/source-loader
bawah tenda. Jika Anda mengganti konfigurasi webpack (misalnya, mendefinisikan arrayconfig.module.rules
Anda sendiri, Anda harus mengatur sendiri@storybook/source-loader
.