search

zeplin / storybook-zeplin

Storybook addon to view Zeplin resources in story panel
https://storybook-zeplin.netlify.app
MIT License
115 stars 16 forks source link

Cant install plugin with storybook 6.5.9 #59

Closed nod74 closed 1 year ago

nod74 commented 2 years ago

I get warnings when I want to install zeplin addon:

npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: webpack-filter-warnings-plugin@1.2.1 npm WARN Found: webpack@5.70.0 npm WARN node_modules/webpack npm WARN webpack@"5.70.0" from @angular-devkit/build-angular@13.3.7 npm WARN node_modules/@angular-devkit/build-angular npm WARN peer @angular-devkit/build-angular@">=0.8.9 || >= 12.0.0" from @storybook/angular@6.5.9 npm WARN node_modules/@storybook/angular npm WARN 2 more (jest-preset-angular, the root project) npm WARN 34 more (@angular-devkit/build-webpack, @ngtools/webpack, ...) npm WARN npm WARN Could not resolve dependency: npm WARN peer webpack@"^2.0.0 || ^3.0.0 || ^4.0.0" from webpack-filter-warnings-plugin@1.2.1 npm WARN node_modules/webpack-filter-warnings-plugin npm WARN webpack-filter-warnings-plugin@"^1.2.1" from @storybook/builder-webpack4@6.5.9 npm WARN node_modules/@storybook/builder-webpack4 npm WARN npm WARN Conflicting peer dependency: webpack@4.46.0 npm WARN node_modules/webpack npm WARN peer webpack@"^2.0.0 || ^3.0.0 || ^4.0.0" from webpack-filter-warnings-plugin@1.2.1 npm WARN node_modules/webpack-filter-warnings-plugin npm WARN webpack-filter-warnings-plugin@"^1.2.1" from @storybook/builder-webpack4@6.5.9 npm WARN node_modules/@storybook/builder-webpack4

I get errors when imprting the addon:

info @storybook/angular v6.5.9 info info => Cleaning outputDir: C:\Users\lachnit\AppData\Local\Temp\chromatic--20244-OIadRiOnhNeu info => Loading presets info => Compiling manager.. info => Compiling preview.. info Addon-docs: using MDX1 info => Using implicit CSS loaders info => Loading angular-cli config for angular >= 13.0.0 info => Using angular project with "tsConfig:C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\.storybook\tsconfig.json" WARN Your Storybook startup uses a solution that will not be supported in version 7.0. WARN You must use angular builder to have an explicit configuration on the project used in angular.json WARN Read more at: WARN - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#sb-angular-builder) WARN - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#angular13) info => Using angular project "taskbox:build" for configuring Storybook info => Using default Webpack5 setup ERR! ValidationError: Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. ERR! - configuration.entry[13] should be a non-empty string. ERR! -> A module that is loaded upon startup. Only the last one is exported. ERR! at validate (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\node_modules\schema-utils\dist\validate.js:105:11) ERR! at validateSchema (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\validateSchema.js:78:2) ERR! at create (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\webpack.js:111:24) ERR! at webpack (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\webpack.js:158:32) ERR! at f (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\index.js:63:16) ERR! at _callee5$ (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\@storybook\manager-webpack5\dist\cjs\index.js:576:24) ERR! at tryCatch (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:63:40) ERR! at Generator.invoke [as _invoke] (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:294:22) ERR! at Generator.next (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:119:21) ERR! at resume (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\@storybook\manager-webpack5\dist\cjs\index.js:90:362) ERR! ValidationError: Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. ERR! - configuration.entry[13] should be a non-empty string. ERR! -> A module that is loaded upon startup. Only the last one is exported. ERR! at validate (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\node_modules\schema-utils\dist\validate.js:105:11) ERR! at validateSchema (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\validateSchema.js:78:2) ERR! at create (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\webpack.js:111:24) ERR! at webpack (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\webpack.js:158:32) ERR! at f (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\webpack\lib\index.js:63:16) ERR! at _callee5$ (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\@storybook\manager-webpack5\dist\cjs\index.js:576:24) ERR! at tryCatch (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:63:40) ERR! at Generator.invoke [as _invoke] (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:294:22) ERR! at Generator.next (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\regenerator-runtime\runtime.js:119:21) ERR! at resume (C:\Users\lachnit\Documents\GitHub\LUSD-Styleguide\node_modules\@storybook\manager-webpack5\dist\cjs\index.js:90:362) { ERR! errors: [ ERR! { ERR! keyword: 'anyOf', ERR! dataPath: '.entry', ERR! schemaPath: '#/anyOf', ERR! params: {}, ERR! message: 'should match some schema in anyOf', ERR! schema: [Array], ERR! parentSchema: [Object], ERR! data: [Array], ERR! children: [Array] ERR! } ERR! ], ERR! schema: { ERR! definitions: { ERR! Amd: [Object], ERR! AssetFilterItemTypes: [Object], ERR! AssetFilterTypes: [Object], ERR! AssetGeneratorDataUrl: [Object], ERR! AssetGeneratorDataUrlFunction: [Object], ERR! AssetGeneratorDataUrlOptions: [Object], ERR! AssetGeneratorOptions: [Object], ERR! AssetInlineGeneratorOptions: [Object], ERR! AssetModuleFilename: [Object], ERR! AssetModuleOutputPath: [Object], ERR! AssetParserDataUrlFunction: [Object], ERR! AssetParserDataUrlOptions: [Object], ERR! AssetParserOptions: [Object], ERR! AssetResourceGeneratorOptions: [Object], ERR! AuxiliaryComment: [Object], ERR! Bail: [Object], ERR! CacheOptions: [Object], ERR! CacheOptionsNormalized: [Object], ERR! Charset: [Object], ERR! ChunkFilename: [Object], ERR! ChunkFormat: [Object], ERR! ChunkLoadTimeout: [Object], ERR! ChunkLoading: [Object], ERR! ChunkLoadingGlobal: [Object], ERR! ChunkLoadingType: [Object], ERR! Clean: [Object], ERR! CleanOptions: [Object], ERR! CompareBeforeEmit: [Object], ERR! Context: [Object], ERR! CrossOriginLoading: [Object], ERR! CssChunkFilename: [Object], ERR! CssExperimentOptions: [Object], ERR! CssFilename: [Object], ERR! CssGeneratorOptions: [Object], ERR! CssParserOptions: [Object], ERR! Dependencies: [Object], ERR! DevServer: [Object], ERR! DevTool: [Object], ERR! DevtoolFallbackModuleFilenameTemplate: [Object], ERR! DevtoolModuleFilenameTemplate: [Object], ERR! DevtoolNamespace: [Object], ERR! EmptyGeneratorOptions: [Object], ERR! EmptyParserOptions: [Object], ERR! EnabledChunkLoadingTypes: [Object], ERR! EnabledLibraryTypes: [Object], ERR! EnabledWasmLoadingTypes: [Object], ERR! Entry: [Object], ERR! EntryDescription: [Object], ERR! EntryDescriptionNormalized: [Object], ERR! EntryDynamic: [Object], ERR! EntryDynamicNormalized: [Object], ERR! EntryFilename: [Object], ERR! EntryItem: [Object], ERR! EntryNormalized: [Object], ERR! EntryObject: [Object], ERR! EntryRuntime: [Object], ERR! EntryStatic: [Object], ERR! EntryStaticNormalized: [Object], ERR! EntryUnnamed: [Object], ERR! Environment: [Object], ERR! Experiments: [Object], ERR! ExperimentsCommon: [Object], ERR! ExperimentsNormalized: [Object], ERR! ExternalItem: [Object], ERR! ExternalItemFunctionData: [Object], ERR! ExternalItemValue: [Object], ERR! Externals: [Object], ERR! ExternalsPresets: [Object], ERR! ExternalsType: [Object], ERR! FileCacheOptions: [Object], ERR! Filename: [Object], ERR! FilenameTemplate: [Object], ERR! FilterItemTypes: [Object], ERR! FilterTypes: [Object], ERR! GeneratorOptionsByModuleType: [Object], ERR! GlobalObject: [Object], ERR! HashDigest: [Object], ERR! HashDigestLength: [Object], ERR! HashFunction: [Object], ERR! HashSalt: [Object], ERR! HotUpdateChunkFilename: [Object], ERR! HotUpdateGlobal: [Object], ERR! HotUpdateMainFilename: [Object], ERR! HttpUriAllowedUris: [Object], ERR! HttpUriOptions: [Object], ERR! HttpUriOptionsAllowedUris: [Object], ERR! IgnoreWarnings: [Object], ERR! IgnoreWarningsNormalized: [Object], ERR! Iife: [Object], ERR! ImportFunctionName: [Object], ERR! ImportMetaName: [Object], ERR! InfrastructureLogging: [Object], ERR! JavascriptParserOptions: [Object], ERR! Layer: [Object], ERR! LazyCompilationDefaultBackendOptions: [Object], ERR! LazyCompilationOptions: [Object], ERR! Library: [Object], ERR! LibraryCustomUmdCommentObject: [Object], ERR! LibraryCustomUmdObject: [Object], ERR! LibraryExport: [Object], ERR! LibraryName: [Object], ERR! LibraryOptions: [Object], ERR! LibraryType: [Object], ERR! Loader: [Object], ERR! MemoryCacheOptions: [Object], ERR! Mode: [Object], ERR! ModuleFilterItemTypes: [Object], ERR! ModuleFilterTypes: [Object], ERR! ModuleOptions: [Object], ERR! ModuleOptionsNormalized: [Object], ERR! Name: [Object], ERR! NoParse: [Object], ERR! Node: [Object], ERR! NodeOptions: [Object], ERR! Optimization: [Object], ERR! OptimizationRuntimeChunk: [Object], ERR! OptimizationRuntimeChunkNormalized: [Object], ERR! OptimizationSplitChunksCacheGroup: [Object], ERR! OptimizationSplitChunksGetCacheGroups: [Object], ERR! OptimizationSplitChunksOptions: [Object], ERR! OptimizationSplitChunksSizes: [Object], ERR! Output: [Object], ERR! OutputModule: [Object], ERR! OutputNormalized: [Object], ERR! Parallelism: [Object], ERR! ParserOptionsByModuleType: [Object], ERR! Path: [Object], ERR! Pathinfo: [Object], ERR! Performance: [Object], ERR! PerformanceOptions: [Object], ERR! Plugins: [Object], ERR! Profile: [Object], ERR! PublicPath: [Object], ERR! RawPublicPath: [Object], ERR! RecordsInputPath: [Object], ERR! RecordsOutputPath: [Object], ERR! RecordsPath: [Object], ERR! Resolve: [Object], ERR! ResolveAlias: [Object], ERR! ResolveLoader: [Object], ERR! ResolveOptions: [Object], ERR! ResolvePluginInstance: [Object], ERR! RuleSetCondition: [Object], ERR! RuleSetConditionAbsolute: [Object], ERR! RuleSetConditionOrConditions: [Object], ERR! RuleSetConditionOrConditionsAbsolute: [Object], ERR! RuleSetConditions: [Object], ERR! RuleSetConditionsAbsolute: [Object], ERR! RuleSetLoader: [Object], ERR! RuleSetLoaderOptions: [Object], ERR! RuleSetLogicalConditions: [Object], ERR! RuleSetLogicalConditionsAbsolute: [Object], ERR! RuleSetRule: [Object], ERR! RuleSetRules: [Object], ERR! RuleSetUse: [Object], ERR! RuleSetUseItem: [Object], ERR! ScriptType: [Object], ERR! SnapshotOptions: [Object], ERR! SourceMapFilename: [Object], ERR! SourcePrefix: [Object], ERR! StatsOptions: [Object], ERR! StatsValue: [Object], ERR! StrictModuleErrorHandling: [Object], ERR! StrictModuleExceptionHandling: [Object], ERR! Target: [Object], ERR! TrustedTypes: [Object], ERR! UmdNamedDefine: [Object], ERR! UniqueName: [Object], ERR! WarningFilterItemTypes: [Object], ERR! WarningFilterTypes: [Object], ERR! WasmLoading: [Object], ERR! WasmLoadingType: [Object], ERR! Watch: [Object], ERR! WatchOptions: [Object], ERR! WebassemblyModuleFilename: [Object], ERR! WebpackOptionsNormalized: [Object], ERR! WebpackPluginFunction: [Object], ERR! WebpackPluginInstance: [Object] ERR! }, ERR! title: 'WebpackOptions', ERR! description: 'Options object as provided by the user.', ERR! type: 'object', ERR! additionalProperties: false, ERR! properties: { ERR! amd: [Object], ERR! bail: [Object], ERR! cache: [Object], ERR! context: [Object], ERR! dependencies: [Object], ERR! devServer: [Object], ERR! devtool: [Object], ERR! entry: [Object], ERR! experiments: [Object], ERR! externals: [Object], ERR! externalsPresets: [Object], ERR! externalsType: [Object], ERR! ignoreWarnings: [Object], ERR! infrastructureLogging: [Object], ERR! loader: [Object], ERR! mode: [Object], ERR! module: [Object], ERR! name: [Object], ERR! node: [Object], ERR! optimization: [Object], ERR! output: [Object], ERR! parallelism: [Object], ERR! performance: [Object], ERR! plugins: [Object], ERR! profile: [Object], ERR! recordsInputPath: [Object], ERR! recordsOutputPath: [Object], ERR! recordsPath: [Object], ERR! resolve: [Object], ERR! resolveLoader: [Object], ERR! snapshot: [Object], ERR! stats: [Object], ERR! target: [Object], ERR! watch: [Object], ERR! watchOptions: [Object] ERR! } ERR! }, ERR! headerName: 'Webpack', ERR! baseDataPath: 'configuration', ERR! postFormatter: [Function: postFormatter] ERR! } info => Loading presets

mertkahyaoglu commented 1 year ago

@yannbf Do you have any idea why this happens?

yannbf commented 1 year ago

This is weird, seems like the issue is related to @nod74's webpack configuration:

ValidationError: Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. ERR! - configuration.entry[13] should be a non-empty string.

This addon does not have any presets for webpack. Hey @nod74 are you sure the issue is happening only by adding this addon? Or did maybe other dependencies/configurations update? Do you have a repro to help us identify the issue? Thanks!

yannbf commented 1 year ago

Hey it's been quite some time since this issue was opened, I think we can close it until we have a proper reproduction. Probably try this out with Storybook 7, and maybe the problem is gone? Thank you!