Fix storybook config #7988
Fix storybook config #7988
Conversation
| 'react-native$': 'react-native-web', | ||
| '@react-native-community/netinfo': path.resolve(__dirname, '../__mocks__/@react-native-community/netinfo.js'), | ||
| }; | ||
| const webConfig = getCommonConfig({envFile: '.env.production'}); |
There was a problem hiding this comment.
The correct path is .env.production (vs ../.env.production) - tested this by using stuff from CONFIG in stories and it would give the prod values
| config.resolve.alias = { | ||
| 'react-native-config': 'react-web-config', | ||
| 'react-native$': 'react-native-web', | ||
| '@react-native-community/netinfo': path.resolve(__dirname, '../__mocks__/@react-native-community/netinfo.js'), | ||
| }; |
There was a problem hiding this comment.
This used to overwrite config.resolve.alias, but if you check it you will see a lot of storybook related aliases in there. Instead of overwriting we should merge our changes in
| config.resolve.alias = { | ||
| 'react-native-config': 'react-web-config', | ||
| 'react-native$': 'react-native-web', | ||
| '@react-native-community/netinfo': path.resolve(__dirname, '../__mocks__/@react-native-community/netinfo.js'), |
There was a problem hiding this comment.
Not sure why we used the a netinfo mock here, I've removed it and didn't see any problems
tagging @marcaaron since I saw you on the blame
There was a problem hiding this comment.
Do not remember, sorry. If it works without it then 🚀
|
Hi, is there a GH issue or Slack discussion somewhere where I can get some background context on this change? Thanks! |
|
It's related to a config regression found here: #7744 (comment) |
| const babelRulesIndex = _.findIndex(custom.module.rules, rule => rule.loader === 'babel-loader'); | ||
| const babelRule = custom.module.rules[babelRulesIndex]; | ||
| const babelRulesIndex = _.findIndex(webConfig.module.rules, rule => rule.loader === 'babel-loader'); | ||
| const babelRule = webConfig.module.rules[babelRulesIndex]; |
There was a problem hiding this comment.
looks like we can simplify this a bit:
const babelRule = _.find(webConfig.module.rules, rule => rule.loader === 'babel-loader');
|
Sorry, @kidroca is there a bug report somewhere? I'm not sure what this is actually fixing, the storybook site seems to be working okay for me: https://staging.new.expensify.com/docs/index.html. I know you mentioned that the environment file is wrong (and I'm 👍 to fix it in this PR), but I just want to make sure I know if there's something specific that is broken that we should be testing here. |
You brought storybook as a regression here: #7744 (comment) Decided to post this today as it reduces the overall config |
|
Close old PR |
@roryabraham
Details
Update storybook config after changes to common webpack configuration
Fixed Issues
$ N/A
Tests
npm storybook-buildcreates a bundle that can be served (outputted at dist/docs)npm run storybookstarts the local storybook dev serverPR Review Checklist
Contributor (PR Author) Checklist
mainbefore submitting my PR for review### Fixed Issuessection abovesrc/languages/*files (if applicable)Styling.md) for all style edits I madePR Reviewer Checklist
mainbefore submitting the PR### Fixed Issuessection abovesrc/languages/*files (if applicable)QA Steps
Tested On
Screenshots
Web
Mobile Web
Desktop
iOS
Android