Storybook 7.0.23 - TypeError : filterProps.indexOf n'est pas une fonction
<p>J'ai un composant React simple : </p>
<pre class="brush:php;toolbar:false;">importer React depuis 'react';
const Bouton = (accessoires) =>
retour (
<div>Accessoires de mon bouton : {Object.keys(props)}</div>
)
}
Exporter le bouton par défaut ;</pre>
<p>J'ai une histoire de livre de contes comme suit :</p>
<pre class="brush:php;toolbar:false;">importer React depuis 'react';
importer le bouton depuis './' ;
exporter par défaut {
composant : <Bouton />,
balises : ['autodocs'],
} ;
export const Par défaut = {
arguments : {
primaire : vrai
},
};</pré>
<p>Mais lorsque le livre de contes s'exécute, j'obtiens l'erreur suivante : </p>
<pre class="brush:php;toolbar:false;">Uncaught TypeError : filterProps.indexOf n'est pas une fonction
à index.js: 576: 1
sur Array.filter (<anonyme>)
au formatReactElementNode (index.js:575:1)
au formatTreeNode (index.js:735:1)
au formatTree (index.js:746:1)
à réagirElementToJsxString (index.js:786:1)
sur config.mjs : 19 : 1
sur mapSingleChildIntoContext (react.development.js:1149:1)
à traversAllChildrenImpl (react.development.js:1007:1)
à traverseAllChildren (react.development.js:1092:1)</pre>
<p>J'ai remarqué que lorsque je supprime le <code>args</code> dans le livre d'histoires, le composant s'affiche.</p>
<p>.storybook/main.js:</p>
<pre class="brush:php;toolbar:false;">module.exports = {
histoires: [
"../src/**/*.story.@(js|jsx|ts|tsx)",
],
modules complémentaires : [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-interactions",
],
cadre: {
nom : "@storybook/react-webpack5",
options : {},
},
documents : {
autodocs : "balise",
},
dactylographié : {
réagirDocgen : faux
},
webpackFinal : (config) => {
const cssLoaders = [{
chargeur : 'postcss-loader',
options : {
plugins : [
require('postcss-assets')({ cache : true }),
require('autoprefixer')({ navigateurs : ['chrome 44'] })
]
}
}, {
chargeur : 'sass-loader',
options : {
includePaths : ['node_modules', 'src/scss'],
quietDeps : vrai
}
}]
config.module.rules.push({
test : /.js?$/,
exclure : /(node_modules|coverage|target)/,
chargeur : 'babel-loader',
options : {
plugins : ['@babel/plugin-syntax-dynamic-import']
}
}, {
test : /.s?css$/,
utilisez : ['style-loader', ...cssLoaders]
});
retourner la configuration ;
},
}</pré>
<p>.storybook/preview.js:</p>
<pre class="brush:php;toolbar:false;">const aperçu = {
paramètres: {
actions : { argTypesRegex : "^on[A-Z].*" },
contrôles: {
correspondants : {
couleur : /(arrière-plan|couleur)$/i,
date : /Date$/,
},
},
},
} ;
exporter l'aperçu par défaut ;</pre>
<p> lt;/code>< ;/p>
<p>不太确定发生了什么!</p>
<p>编辑:</p>
<p>
<code>node_modules/react-element-to-jsx-string/dist/cjs/index.js</code></p>