storybook: In production, stories do not appear in export order

Describe the bug In production, stories do not appear in export order. Instead, they are sorted alphabetically.

#15574 describes similar behavior and was closed when a fix was released in v6.14.13 and v6.5.0-alpha.17. I’m still experiencing this problem with Storybook 6.5.0-alpha.45, however.

Screenshot of dev server and production server

Thank you in advance for your help!! 😄

To Reproduce

  1. Clone https://github.com/rdebeasi/storybook-sort-repro

  2. Run yarn storybook to start Storybook in dev mode. Stories appear in export order (Story C, Story B, Story A). This is the expected behavior.

  3. Run yarn build-storybook && npx serve to start Storybook in production mode. Shows appear in sorted in alphabetical order (Story A, Story B, Story C). This behavior appears to be a bug.

System

  OS: macOS 11.6.4

  CPU: (8) x64 Intel(R) Core(TM) i7-8559U CPU @ 2.70GHz

 Binaries:

  Node: 14.15.1 - ~/.nvm/versions/node/v14.15.1/bin/node

  Yarn: 3.2.0 - ~/.yarn/bin/yarn

  npm: 6.14.8 - ~/.nvm/versions/node/v14.15.1/bin/npm

 Browsers:

  Chrome: 98.0.4758.109

  Firefox: 97.0.1

  Safari: 15.3

 npmPackages:

  @storybook/addon-actions: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/addon-docs: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/addon-essentials: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/addon-interactions: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/addon-links: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/angular: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/builder-webpack5: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/manager-webpack5: ^6.5.0-alpha.45 => 6.5.0-alpha.45 

  @storybook/testing-library: ^0.0.9 => 0.0.9 

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 1
  • Comments: 18 (8 by maintainers)

Most upvoted comments

@rdebeasi @himerus I’m seeing an inconsistency between the babel config for angular (broken) vs. react (works). will investigate further. are all the projects you’re seeing this on using Angular? If not, what framework? thanks! 🙏