Use react-app-rewired and react-app-rewire-alias for DevX #954
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This was referenced Jan 18, 2024
added 2 commits
January 26, 2024 09:54
# [editor][wip] Packaging AIConfigEditor Component with Vite This PR separates our current editor implementation into a root package containing the LocalEditor and a library package containing the AIConfigEditor and its associated code. When we want to publish the `@lastmileai/aiconfig-editor` package, just cd into the `aiconfig-editor` dir and run `yarn && yarn build` before running `npm publish`. `yarn build` will compile the react code to commonjs and esm format files & source maps (separated by specific folders) and the appropriate type declarations. This will allow the package to be used in most js projects. We can't land this as-is because it essentially breaks the dev x, preventing HMR from working. The next couple diffs should fix that.
# Use react-app-rewired and react-app-rewire-alias for DevX The first step in fixing the DevX for the new packaging structure is to get HMR working to ensure changes to code get reflected in the browser during development. This PR leverages `react-app-rewired` and `react-app-rewire-alias` to allow us to: 1. Override the default configurations set in place by the `react-scripts` setup we're using (mainly, webpack configuration) 2. Specify aliases for paths, which enables us to link to our local aiconfig-editor package code instead of the node modules package Unfortunately, 2. only applies to the react code itself right now, NOT type declarations. So, you can do something like remove/change existing components in jsx, but changing their props will not be reflected in HMR... Next PR should fix that
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Use react-app-rewired and react-app-rewire-alias for DevX
Use react-app-rewired and react-app-rewire-alias for DevX
The first step in fixing the DevX for the new packaging structure is to get HMR working to ensure changes to code get reflected in the browser during development. This PR leverages
react-app-rewiredandreact-app-rewire-aliasto allow us to:react-scriptssetup we're using (mainly, webpack configuration)Unfortunately, 2. only applies to the react code itself right now, NOT type declarations. So, you can do something like remove/change existing components in jsx, but changing their props will not be reflected in HMR...
Next PR should fix that
Stack created with Sapling. Best reviewed with ReviewStack.