@skyscanner/backpack-react-scripts v11.1.1
backpack-react-scripts
Important: The currently supported version of CRA by backpack-react-scripts
is up to v3.4.1
. Versions above this will not work.
This package is a fork of Create React App (specifically the
react-scripts
package). It's intended to be used in conjuction with create-react-app
like so:
npx create-react-app@3.4.1 my-app --scripts-version=@skyscanner/backpack-react-scripts --template @skyscanner/backpack --use-npm
# start your app development like you normally would with `create-react-app`
cd my-app
npm start
What is different in our fork?
- Compilation of uncompiled Backpack components (specifically JSX).
- Skyscanner specific template with Backpack components integrated out of the box. Published as
@skyscanner/cra-template-backpack
- CSS Modules enabled by default for all
.css
&.scss
files. - Ability to create a bundle for server side rending.
- Automatic chunking is disabled by default.
css.html
&js.html
: New files in thebuild/
output folder. These are html partials that include<script />
and<link />
references to the various static assets output by webpack. Useful if automatic chunking is turned on and you don't want to worry about order.- A bunch of configuration options via
"backpack-react-scripts"
field inpackage.json
:crossOriginLoading
: Modify the default behaviour, see docs.babelIncludePrefixes
: An array of module name prefixes to opt into babel compilation. Includes["bpk-", "saddlebag-"]
by default.enableAutomaticChunking
: Boolean, opt in to automatic chunking of vendor, common and app code.vendorsChunkRegex
: String, Regex for picking what goes into thevendors
chunk. SeecacheGroups
in webpack docs. Dependent onenableAutomaticChunking
being enabledamdExcludes
: Array of module names to exclude from AMD parsing. Incldues["lodash"]
by default.externals
: exposing the Webpack config to modify externals, see docs.ssrExternals
: Similar to above, but forssr.js
only.cssModules
: Boolean, true by default.sriEnabled
: Sets if SRI is to be used during build to add integrity hash for files, see docs.- Note if this is enabled,
crossOriginLoading
value is overriden withanonymous
in order for it to output with the integrity value.
- Note if this is enabled,
Releasing a new version of backpack-react-scripts
To publish a new version of
backpack-react-scripts
, run the following command:npm run publish
You will be prompted to select a new semver version (MAJOR, MINOR, PATCH). Use the CHANGELOG.md to decide on the nature of the changes since the last release.
- If you want to be extra careful, you can publish a prerelease by running this instead:
npm run publish -- --canary
Update the CHANGELOG.md with the new version, taking care to follow the format of previous releases.
Keeping this fork updated
We wish to keep this fork updated with the upstream repo to benefit from the ongoing open source development
of create-react-app
. To keep this fork up to date, please follow the steps below:
Ensure
master
is in sync withupstream/master
:git checkout master git remote add upstream git@github.com:facebook/create-react-app.git git fetch upstream git reset --hard upstream/master git push --force-with-lease
Rebase
fork
on top of a tagged release onmaster
:git checkout fork git rebase <commit>
Note:
<commit>
should be the SHA-1 of the latest upstream release - not the latest commit i.e.upstream/master
Pair with someone else to fix any conflicts and cross examine changes in upstream with changes in our fork.
This is the most time consuming part. Take care to make sure you are not regressing any functionality that we have added in our fork.
Re-name your local, rebased
fork
branch to something else and push it to origin. This will ensure it runs through CI and you can verify your changes.git branch -m <branch> git push origin <branch>
Finally, when we are confident that the rebase has been successful, re-name your branch back to
fork
and push it to origin:git branch -m fork git push --force-with-lease
23 days ago
23 days ago
23 days ago
1 month ago
1 month ago
1 month ago
1 month ago
2 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
5 months ago
6 months ago
5 months ago
5 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
5 months ago
7 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
10 months ago
10 months ago
6 months ago
6 months ago
5 months ago
6 months ago
6 months ago
5 months ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago