react-scripts
This package includes scripts and configuration used by Create React App.
Please refer to its documentation:
- Getting Started – How to create a new app.
- User Guide – How to develop apps bootstrapped with Create React App.
HackerHouse Configuration and scripts for Create React App.
This package includes scripts and configuration used by Create React App.
Please refer to its documentation:
react-scripts
npm start
. (@ryanwalters)eslint-config-react-app
react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.9.5
create-react-app
react-scripts
react-dev-utils
#1690 Fix openBrowser()
when BROWSER=open
on macOS. (@bpierre)
#1696 Improve reliability of port detection. (@chrisdrackett)
eslint-config-react-app
, react-scripts
#1705 Add support for ignoreRestSiblings
in no-unused-vars
. (@chrisdrackett)
Linter no longer warns when using rest properties to remove variables from an object.
react-dev-utils
, react-scripts
react-dev-utils
. (@viankakrisna)Other
react-scripts
react-scripts
eslint-config-react-app
eslint-config-react-app
, react-dev-utils
, react-scripts
react-dev-utils
lerna
version. (@viankakrisna)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.9.4
You may also optionally update the global command-line utility for scoped package support:
npm install -g create-react-app@1.3.0
create-react-app
If you are using Yarn, and you have created at least one app previously, Create React App now works offline.
react-scripts
create-react-app
react-scripts
X-FORWARDED
headers for proxy requests. (@johann-sonntagbauer)react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.9.3
You may also optionally update the global command-line utility for offline Yarn cache support:
npm install -g create-react-app@1.2.1
create-react-app
#1253 Install time optimization. (@n3tr)
React, ReactDOM, and react-scripts
are now installed in the same install instead of two different installs. This reduces app creation time by a noticeable amount.
#1512 Graceful error handling. (@chitchu)
If an error occurs while create-react-app
is running, it will now clean up and not leave a broken project to reduce confusion.
#1193 Suggest upgrading to NPM >= 3 for faster install times. (@mobinni)
#1603 Allow app creation in a WebStorm project. (@driquelme)
#1570 Allow git urls in --scripts-version
. (@tomconroy)
react-scripts
#1578 Enable lint caching in development. (@viankakrisna)
#1478 Update the build script message to show the correct port. (@chyipin)
#1560 Bump recursive-readdir
. (@wtgtybhertgeghgtwtg)
react-scripts
#1635 Fix Jest configuration. (@Timer)
Fixes ejecting on Windows for macOS and Linux machines.
#1356 Fix workflow if react-scripts package is linked via npm-link. (@tuchk4)
Advanced users may opt to fork react-scripts
instead of ejecting so they still receive upstream updates.
react-scripts
will now function as expected when linking to a development version.
Previously, you could not test changes with an existing application via linking.
#1585 Ensure PORT environment variable is an integer. (@matoilic)
#1628 Show correct port for pushstate-server URL text. (@mattccrampton)
react-snapshot
. (@superhighfives)jest-enzyme
documentation. (@kiranps)jest-enzyme
for simplifying test matchers. (@blainekasten)babel-preset-react-app
test -e
in e2e. (@igetgames)Note: 0.9.1 had known issues so you should skip it.
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.9.2
You may also optionally update the global command-line utility for more efficient installs (thanks @n3tr):
npm install -g create-react-app@1.1.0
This release has known issues and you should skip it. Update directly to 0.9.2 instead.
Thanks to @Timer for cutting this release.
react-scripts
#1489 Support setting "homepage"
to "."
to generate relative asset paths. (@tibdex)
Applications that don’t use the HTML5 pushState
API can now be built to be served from any relative URL. To enable this, specify "."
as your homepage
setting in package.json
. It used to be possible before with a few known bugs, but they should be fixed now. See Serving the Same Build from Different Paths.
#937 Add PUBLIC_URL
environment variable for advanced use. (@EnoahNetzach)
If you use a CDN to serve the app, you can now specify PUBLIC_URL
environment variable to override the base URL (including the hostname) for resources referenced from the built code. This new variable is mentioned in the new Advanced Configuration section.
#1440 Make all REACT_APP_*
environment variables accessible in index.html
. (@jihchi)
This makes all environment variables previously available in JS, also available in the HTML file, for example %REACT_APP_MY_VARIABLE%
. See Referencing Environment Variables in HTML.
react-dev-utils
#1148 Configure which browser to open with npm start
. (@GAumala)
You can now disable the automatic browser launching by setting the BROWSER
environment variable to none
. You can also specify a different browser (or an arbitrary script) to open by default, as supported by opn
command that we use under the hood. See Advanced Configuration.
react-scripts
#1311 Updated babel-jest
and jest
packages to 18.0.0. (@lopezator)
Jest has been updated to 18 and has introduced some breaking changes and new features.
react-scripts
, react-dev-utils
#1264 Remove interactive shell check when opening browser on start. (@CaryLandholt)
Non-interactive terminals no longer automatically disable launching of the browser. Instead, you need to specify none
as BROWSER
environment variable if you wish to disable it.
react-scripts
#1441 Added babel-runtime
dependency to deduplicate dependencies when using Yarn. (@jkimbo)
This works around a bug in Yarn that caused newly created projects to be over 400MB. Now they are down to 126MB, just like with npm 3.
react-scripts
from dependencies on eject. (@creynders)babel-loader
version (#1009). (@frontsideair)react-dev-utils
react-scripts
env.CI = true
warnings causing failures. (@jayphelps)babel-jest
and jest
packages to 18.0.0. (@lopezator)'\n'
to the end of package.json
file. (@pd4d10)&&
in deploy script. (@zpao)create-react-app
User Guide
READMEs
Internal Test Suite
Other
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.9.0
Then, run your tests. If you are affected by breaking changes from Jest 18, consult blog post, changelog, and documentation. You might need to update any snapshots since their format might have changed.
If you relied on the browser not starting in non-interactive terminals, you now need to explicitly specify BROWSER=none
as an environment variable to disable it.
Thanks to @fson for cutting this release.
create-react-app
, react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.5
You may also optionally update the global command-line utility:
npm install -g create-react-app@1.0.3
react-scripts
#1233 Disable subresource integrity temporarily. (@Timer)
We added Subresource Integrity checks to the build output in 0.8.2 but it turns out that they may fail in browsers using special compression proxies, such as Chrome on Android, when served over HTTP. We disabled the checks until we can find a safe way to add them.
react-dev-utils
create-react-app
Fixes noisy output on Windows when Yarn is not installed.
react-scripts
#1237 Clear scrollback in test mode. (@gaearon)
Ensures test watcher clears the console before running.
#1229 Disable jest watch mode when --coverage flag is present [#1207]. (@BenoitAverty)
Since coverage doesn't work well with watch mode, we don’t run the watcher on npm test -- --coverage
anymore.
#1212 Proxy rewrites Origin header to match the target server URL. (@koles)
Makes sure more API endpoints can work with the proxy
setting.
#1222 Disable gh-page setup instruction if scripts.deploy has been added. (@n3tr)
Suppresses the instructions printed at the end of npm run build
if npm run deploy
already exists.
create-react-app
#1236 Tweak console messages. (@gaearon)
Makes error messages more friendly.
#1195 Use "commander" for cli argv handling. (@EnoahNetzach)
Adds create-react-app --help
with a list of options.
react-dev-utils
react-dev-utils
react-scripts
react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.4
You may also optionally update the global command-line utility:
npm install -g create-react-app@1.0.2
create-react-app
react-scripts
#1203 Update webpack-subresource-integrity to fix Windows builds. (@gaearon)
Fixes a crash when running npm run build
on Windows.
#1201 Instruct Jest to load native components from RNW instead of RN. (@remon-georgy)
Fixes tests for users of React Native Web.
react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.3
You can optionally update the global CLI too:
npm install -g create-react-app@1.0.1
react-scripts
#1176 Add Subresource Integrity support. (@XVincentX)
The generated HTML now includes Subresource Integrity attributes ensuring that your users aren't served malicious code if your CDN gets compromised.
react-scripts
#1197 Let Jest handle all file types. (@gaearon)
Since 0.8.0, we started treating imports of any unknown file extensions as URLs. However, we had to revert this change for the test configuration in 0.8.1 because of a bug causing false positives. In 0.8.2, we are fixing this and making test configuration treat imports with unknown extensions the same way as we do in the browser environment.
#1194 Only honor relative NODE_PATH
. (@gaearon)
Historically we have allowed specifying NODE_PATH
environment variable as a way to allow “absolute imports”. For example, running NODE_PATH=src npm start
in Bash or set NODE_PATH=src&&npm start
in Windows Cmd would let you import anything inside src
without specifying a relative path. However, we found a few nasty edge cases when Node.js core modules end up being in NODE_PATH
and erroneously become bundled. As a result the build would crash on some systems when some libraries are imported. To fix this, we now only honor relative paths from NODE_PATH
in Create React App. This means the existing use case for absolute imports is still supported (src
in the example above is relative), but absolute paths in NODE_PATH
(such as paths to Node.js core modules) will be ignored.
#1188 Update Webpack to fix source map issues. (@gaearon)
Since 0.8.0, we show source maps in development instead of the compiled code. However, it has come to our attention that Webpack's source map implementation had issues interpreting Babel output, and caused source maps to be wrong and breakpoints to be unusable in some cases. Webpack has released a fix for this, and we have updated the minimal version of Webpack that we are using.
#1180 Use file-loader
for svgs. (@bogdansoare)
Since 0.8.0, we are treating all imports with non-JS/CSS extensions the same way. Importing them gives you a string with their URL, and if their content is small enough (less than 10K), the URL is in fact an inlined data URI. However, this doesn't work well with SVGs in case you use them for a sprite system since fragments don't work in data URIs, and it's wasteful to inline the same sprite SVG many times. To fix this, we have added an exception so that SVG files never get inlined.
react-dev-utils
babel-preset-react-app
eslint-config-react-app
#1191 Relax peerDependencies for ESLint preset. (@gaearon)
This allows the preset to be used in more apps without peer dependency conflicts. We still pin the exact versions in apps that haven't ejected for extra safety.
#1159 Make jsx-no-undef rule an error. (@existentialism)
Using an undefined type in JSX is now treated as a hard lint error because it is guaranteed to crash application at runtime.
react-scripts
#1175 Remove path module from webpack config on eject. (@harunhasdal)
This makes the output after ejecting a bit cleaner.
#1120 Add testURL
to Jest config. (@spudly)
This fixes an error when running tests that interact with History API in jsdom.
react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.2
Thanks to @fson for cutting this release.
react-scripts
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.1
Thanks to @fson for cutting this release.
react-scripts
#944 Crash the build during CI whenever linter warnings are encountered. (@excitement-engineer)
Linter warnings and errors are now checked during a continuous integration build (set by the CI
environment variable) and the build will fail if any issues are found. See Continuous Integration for more information.
create-react-app
, react-scripts
Yarn is a new fast, reliable and secure alternative to the npm
client. If you have Yarn installed, create-react-app
will use it to install packages when you create an app. It also creates a yarn.lock
file that should be checked into source control (e.g. git). This ensures the same versions of packages will be installed each time yarn install
is run, on any machine.
react-scripts
now also displays instructions using yarn
commands for projects using Yarn (projects having a yarn.lock
file).
To create a project using Yarn, simply install yarn
and use create-react-app
like before:
npm install -g yarn create-react-app@latest
create-react-app my-app # Packages are now installed with Yarn.
babel-preset-react-app
#902 Enable useBuiltIns option on object-rest-spread. (@existentialism)
Object rest spread and JSX now use the native Object.assign()
method instead of Babel's helper function. If you are using babel-preset-react-app
directly in your project and targeting browsers that don't have Object.assign()
available, from now on you need a polyfill for it (e.g. object-assign
).
Note: react-scripts
already adds this polyfill, so no changes are necessary in Create React App projects.
react-scripts
#978 Move the remove-on-eject-end tag at the end of the file. (@EnoahNetzach)
Fixes a bug in ejected configuration.
#1017 Don't look for .babelrc
file during test. (@nhajidin)
Fixes a .babelrc
file in a parent directory interfering with the npm test
command.
#951 Check for presence of folders before continuing eject. (@heldinz)
Fixes a bug where eject
failed when a scripts
or config
folder already existed in the project.
react-dev-utils
#1035 Fix Chrome tab reuse. (@einarlove)
Fixes a bug with the app not opening in the existing tab in Chrome.
#964 Catch and noop call to open web browser. (@spadin)
Not being able to open a browser doesn't crash the development server now.
eslint-config-react-app
, react-scripts
react-scripts
#1059 Use url-loader
with limit 10k as a default loader. (@bebbi)
react-scripts
now treats imports with any unknown file extension as a resource. Files with a size below 10 KB are inlined using a data URI and larger files copied to the build folder. This removes the need for an internal whitelist of supported file extensions. Any file that's not JS or CSS is now handled the same way.
#924 Enable JavaScript source maps in development. (@ekaradon)
#961 Add collectCoverageFrom
option to collect coverage on files without any tests. (@pmackcode)
The test script now considers all files in the project when calculating test coverage.
#968 Enable gzip compression in the development server (#966). (@frontsideair)
react-dev-utils
, react-scripts
#816 add logging of existing default port process on start. (@ianmcnally)
react-scripts
can guess which process is running on the port 3000 when it's not available:
Something is already running on port 3000. Probably:
my-app
in /Users/ian/dev/my-app
Would you like to run the app on another port instead?
react-dev-utils
react-scripts
function
from export statement. (@gnowoel)react-scripts
babel-preset-react-app
You may optionally update the global command (it’s not required, but it adds Yarn support for new projects):
npm install -g create-react-app@1.0.0
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.8.0
Thanks to @fson for cutting this release.
react-scripts
)src/setupTests.js
is now called after test framework initialization to support loading custom matchers. (@just-boris in #846)process.env
object. (@dvkndn in #807)@import
statements. (@nhunzaker in #929)eslint-config-react-app
)import/no-webpack-loader-syntax
rule that forbids using custom Webpack specific syntax to specify Webpack loaders in import statements. (@fson in #803)react/react-in-jsx-scope
rule ("React must be in scope") is now an error. (@gaearon in #822)no-unused-expressions
rule now allows the use of short circuit and ternary expressions. (@cannona in #724)babel-preset-react-app
)babel-preset-env
. (@shubheksha in #878, @JeffreyATW in #927
)babel-plugin-transform-regenerator
. (@akofman in #864)react-dev-utils
)webpackHotDevClient
. (@michalkvasnicak in #840)create-react-app
)--scripts-version
argument. (@pdillon in #826)--scripts-version
argument. (@jihchi in #876)You may optionally update the global command (it’s not required):
npm install -g create-react-app@0.6.0
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.7.0
Jest 16 includes improvements to snapshot testing and changes to the snapshot format. If your project uses snapshot testing, you'll need to update the snapshot files. To update the snapshots, run:
npm test -- -u
react-scripts
)package.json
after ejecting. (@montogeek in #773)react-dev-utils
)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.6.1
react-scripts
)react-dev-utils
)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.6.0
Note: If the project fails to start, remove node_modules
, ensure react-scripts
is 0.6.0
in your package.json
, and run npm install
again. There seems to be an npm bug affecting this update.
react-scripts
)react-dev-utils
dependencyreact-dev-utils
)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.5.1
react-scripts
)public
folder with arbitrary assets. (@gaearon in #703).env
file. (@ayrton in #695) .babelrc
and .eslintrc
. (@fson in #689, @gaearon in #705)npm start
doesn’t fail in a composed Docker container. (@arekkas in #711)eject
are now cleaner. (@gaearon in #723)eslint-config-react-app
)react/no-danger-with-children
and react/style-prop-object
rules. (@fson in #696)babel-preset-react-app
)react-dev-utils
)create-react-app
)README
to npm. There were no other changes.Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.5.0
If you used a global ESLint installation for the editor integration, you’ll need to install these versions of global ESLint packages.
index.html
into public
FolderYou’ll also need to create a new folder called public
in the root of your project. Then, move index.html
and files it references (such as a favicon) into that folder.
You can no longer reference any files from ./src
in index.html
. Instead, public/index.html
can now only reference files other inside of the public
folder using a special variable called %PUBLIC_URL%
.
For example, instead of:
<link rel="shortcut icon" href="./src/favicon.ico">
You would need to move both index.html
and src/favicon.ico
into the public
folder, and change <link>
to look like this:
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
This ensures it become a part of the build output, and resolves correctly both with client-side routing and non-root homepage
in package.json
. Read more about using the public
folder and why these changes were made.
This is a hotfix release for a broken package.
It contained no changes to the code.
react-scripts
)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.4.3
react-scripts
)jpeg
, wav
, mp3
, m4a
, aac
, and oga
. (@mareksuscak in #624, @danharper in #665)*.json.gzip
files are no longer created in the project folder. (@thangngoc89 in #620)@
now works with tests. (@fson in #584)create-react-app
)react-scripts
to create-react-app
with --scripts-version
works again. (@yesmeck in #632)You may optionally update the global command (it’s not required):
npm install -g create-react-app@0.4.2
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.4.2
react-scripts
).jsx
file extension. (@tizmagik in #563)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.4.1
react-scripts
)NODE_PATH
environment variable for absolute import
paths. (@jimmyhmiller in #476)src/setupTests.js
exists, it will be used to setup the test environment. (@gaelduplessix in #548)HTTPS
environment variable is set to true
, development server will run in HTTPS mode. (@dceddia in #552)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.4.0
Paths like /src/somefile.png
used to be served in development, but only by accident. They never worked in production builds. Since 0.4.0, we don’t serve static files by default in development anymore either. This removes a dangerous inconsistency that we never intentionally supported.
If you need a static file to be part for the build, import it from JavaScript and you will get its filename. This ensures it gets included into the production build as well, and its filename contains the content hash.
If you used static files with <link href>
, read this new guide on how to make sure these files get included into the builds. For example, you can replace <link href="/src/favicons/favicon-32.png">
with <link href="./src/favicons/favicon-32.png">
, and then Webpack will recognize it and include it into the build.
If you referenced some other files from index.html
, please file an issue to discuss your use case. In the meantime, you can serve them from a separate static server until your use case is supported.
react-scripts
)Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.3.1
react-scripts
)src
directory. (@fson in #504)<link href>
in index.html
will now be correctly resolved, so deleting favicon.ico
is not an error anymore. (@andreypopp in #428)<div ref={node => this.node = node}>
. (@mrscobbler in #529)react-constant-elements
Babel transform because of its bugs. (@gaearon in #534)create-react-app
).idea
folder, which is necessary for future WebStorm integration. (@denofevil in #522)You may optionally update the global command (it’s not required):
npm install -g create-react-app@0.3.0
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.3.0
Now favicon.ico
is not treated specially anymore.
If you use it, move it to src
and add the following line to <head>
in your HTML:
<link rel="shortcut icon" href="./src/favicon.ico">
Since 0.3.0 added a test runner, we recommend that you add it to the scripts
section of your package.json
like this:
// ...
"scripts": {
// ...
"test": "react-scripts test --env=jsdom"
}
Then read the testing guide to learn more about using it!
react-scripts
)async
and await
syntax. (@gaearon in #327, @fson in #332).webp
extension are now supported. (@gafemoyano in #458)package.json
. (@wdhorton in #477)Update react-scripts
to point to 0.2.3
in your package.json
and run npm install
. You shouldn’t need to do anything else.
Newly created projects will use 0.2.3
automatically. You don’t need to update the global create-react-app
CLI itself. It stays at 0.2.0
for now because it doesn’t have any changes.
react-scripts
)npm install
ing a missing dependency now forces a rebuild. (@gaearon in #349)Object.assign()
polyfill is now bundled by default. (@gaearon in #399)otf
font format is now supported. (@A-gambit in #434)new-cap
linting rule has been disabled thanks to feedback from Immutable.js users. (@rricard in #470)Update react-scripts
to point to 0.2.2
in your package.json
and run npm install
. You shouldn’t need to do anything else.
Newly created projects will use 0.2.2
automatically. You don’t need to update the global create-react-app
CLI itself. It stays at 0.2.0
for now because it doesn’t have any changes.
react-scripts
)npm start
taking a very long time on OS X with Firewall enabled (@gaearon in #319)?v=
after asset filenames, such as Font Awesome, now works correctly (@alexzherdev in #298)npm link
ing react-scripts
have been fixed (@dallonf in #277)/static
prefix for assets both in development and production (@gaearon in #278)Update react-scripts
to point to 0.2.1
in your package.json
and run npm install
. You shouldn’t need to do anything else. If you see a warning about wrong file casing next time you npm start
, fix your imports to use the correct filename casing.
Newly created projects will use 0.2.1
automatically. You don’t need to update the global create-react-app
CLI itself. It stays at 0.2.0
for now because it doesn’t have any changes.
react-scripts
)homepage
field to package.json
(@dhruska in #94)0.0.0.0
and works with VirtualBox (@JWo1F in #128)3000
port is taken, we offer to use another port (@chocnut in #101, 2edf21)import
CSS files from npm modules (@glennreyes in #105, @breaddevil in #178)fetch
and Promise
polyfills are now always included (@gaearon in #235).gitignore
(@npverni in #79, @chibicode in #112).babelrc
in parent directory no longer causes an error (@alexzherdev in #236).json
extension are now discovered (@gaearon in a11d6a)create-react-app
)--version
flag correctly (@mxstbr in #152)You may optionally update the global command (it’s not required):
npm install -g create-react-app@0.2.0
Inside any created project that has not been ejected, run:
npm install --save-dev --save-exact react-scripts@0.2.0
You may need to fix a few lint warnings about missing <img alt>
tag, but everything else should work out of the box. If you intend to deploy your site to GitHub Pages, you may now add homepage
field to package.json
. If you had issues with integrating editor linter plugins, follow these new instructions.