Storybook: Static build assets are not loading - reactjs

I am building storybook. When trying to load the resulting files, I get this error.
manager.43f5b3475a944261b3fa.bundle.js:formatted:19449 Uncaught (in promise) TypeError: Cannot read property 'children' of undefined
at resolveStyles (manager.43f5b3475a944261b3fa.bundle.js:formatted:19449)
at RadiumEnhancer.render (manager.43f5b3475a944261b3fa.bundle.js:formatted:19191)
at callMethod (manager.43f5b3475a944261b3fa.bundle.js:formatted:409)
at RadiumEnhancer.render (manager.43f5b3475a944261b3fa.bundle.js:formatted:414)
at renderComponent (manager.43f5b3475a944261b3fa.bundle.js:formatted:821)
at setComponentProps (manager.43f5b3475a944261b3fa.bundle.js:formatted:805)
at buildComponentFromVNode (manager.43f5b3475a944261b3fa.bundle.js:formatted:686)
at idiff (manager.43f5b3475a944261b3fa.bundle.js:formatted:691)
at innerDiffNode (manager.43f5b3475a944261b3fa.bundle.js:formatted:743)
at idiff (manager.43f5b3475a944261b3fa.bundle.js:formatted:753)

Related

TypeError [ERR_UNKNOWN_FILE_EXTENSION]

I am trying to do a mini react project and am using external API. I am getting this weird error. Before I was getting error when doing any type of import, but then I added type: "module" in package.json, so now instead I get completely different type of error.
Error:
node:internal/errors:484
ErrorCaptureStackTrace(err);
^
TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".tmp" for /Users/rokas/Projects/quiz-website/src/node_7c47523b50d8c.tmp
at new NodeError (node:internal/errors:393:5)
at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:79:11)
at defaultGetFormat (node:internal/modules/esm/get_format:121:38)
at defaultLoad (node:internal/modules/esm/load:81:20)
at nextLoad (node:internal/modules/esm/loader:163:28)
at ESMLoader.load (node:internal/modules/esm/loader:605:26)
at ESMLoader.moduleProvider (node:internal/modules/esm/loader:457:22)
at new ModuleJob (node:internal/modules/esm/module_job:63:26)
at #createModuleJob (node:internal/modules/esm/loader:480:17)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:434:34) {
code: 'ERR_UNKNOWN_FILE_EXTENSION'
}
Node.js v18.12.1
Thoughts?

"Uncaught TypeError: Cannot set properties of undefined (setting 'Popper') "

After adding "#babel/transform-runtime" plugin to babel.rc file
popper.min.js file throws this error
"Uncaught TypeError: Cannot set properties of undefined (setting 'Popper') "
if I remove the plugin , it works fine

`react-truncate` Package does not work when built and used

Getting error - TypeError: Cannot read property 'length' of undefined in Truncate.js
<Truncate lines={1} onTruncate={this.handleTruncate} > {value} </Truncate>

enable to use reactstrap library in client side spfx

I am creating a client-side web part in SharePoint using react and I am getting an error for using reactstrap in it.
[SPLoaderError.loadComponentError]:
***Failed to load component "e85e1482-17da-4af0-968f-3f63def88702" (ReactSpfxWebPartWebPart).
Original error: ***Failed to load entry point from component "e85e1482-17da-4af0-968f-3f63def88702" (ReactSpfxWebPartWebPart).
Original error: Error loading https://component-id.invalid/e85e1482-17da-4af0-968f-3f63def88702_0.0.1
Cannot read property 'placements' of undefined
***INNERERROR:
***Failed to load entry point from component "e85e1482-17da-4af0-968f-3f63def88702" (ReactSpfxWebPartWebPart).
Original error: Error loading https://component-id.invalid/e85e1482-17da-4af0-968f-3f63def88702_0.0.1
Cannot read property 'placements' of undefined
***CALLSTACK:
Error
at SPLoaderError.SPError [as constructor] (https://localhost:4321/temp/workbench-packages/#microsoft_sp-loader/dist/sp-loader-assembly_default.js:8668:24)
at new SPLoaderError (https://localhost:4321/temp/workbench-packages/#microsoft_sp-loader/dist/sp-loader-assembly_default.js:4124:28)
at Function.ErrorBuilder.buildErrorWithVerboseLog (https://localhost:4321/temp/workbench-packages/#microsoft_sp-loader/dist/sp-loader-assembly_default.js:3783:21)
at Function.ErrorBuilder.buildLoadComponentError (https://localhost:4321/temp/workbench-packages/#microsoft_sp-loader/dist/sp-loader-assembly_default.js:3691:21)
at https://localhost:4321/temp/workbench-packages/#microsoft_sp-loader/dist/sp-loader-assembly_default.js:6936:47
add
"externals": {
"reactstrap": "https://cdnjs.cloudflare.com/ajax/libs/reactstrap/6.0.1/reactstrap.full.min.js"
},
to config.json it will resolve reactstrap dependancy in spfx

Uncaught TypeError: Cannot read property 'style' of undefined

I got error:
**Uncaught TypeError: Cannot read property 'style' of undefined**
when trying to add a child component to a container which has accordion layout.
Below is the error stack call:
Element.override.setHeight ext-all-dev.js:24941
Ext.define.setAttr ext-all-dev.js:60477
Ext.define.applyPendingAttrs ext-all-dev.js:79673
Ext.define.runner ext-all-dev.js:79546
Ext.define.flushAnimations ext-all-dev.js:81227
Ext.define.runComplete ext-all-dev.js:81865
callOverrideParent ext-all-dev.js:35
Base.implement.callParent ext-all-dev.js:6171
Ext.override.runComplete ext-all-dev.js:64510
Ext.define.run ext-all-dev.js:81842
Ext.define.statics.flushLayouts ext-all-dev.js:64514
Ext.define.statics.resumeLayouts ext-all-dev.js:64521
Ext.resumeLayouts
Could you help me find possible reasons? Thanks!

Resources