diff --git a/.travis.yml b/.travis.yml index 0ca362c23c3..860000b5c9b 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,13 +1,9 @@ --- -# Use Ubuntu Precise instead of new default Trusty which cause build fail -# with pre installed yarn v0.17.8 -# https://github.com/facebookincubator/create-react-app/issues/3054 -# TODO: remove after Trusty environment is updated with a lastet version of yarn -dist: precise +dist: trusty language: node_js node_js: - - 6 - 8 + - 9 cache: directories: - node_modules @@ -18,9 +14,8 @@ script: - 'if [ $TEST_SUITE = "simple" ]; then tasks/e2e-simple.sh; fi' - 'if [ $TEST_SUITE = "installs" ]; then tasks/e2e-installs.sh; fi' - 'if [ $TEST_SUITE = "kitchensink" ]; then tasks/e2e-kitchensink.sh; fi' + - 'if [ $TEST_SUITE = "old-node" ]; then tasks/e2e-old-node.sh; fi' env: - global: - - USE_YARN=no matrix: - TEST_SUITE=simple - TEST_SUITE=installs @@ -28,8 +23,6 @@ env: matrix: include: - node_js: 0.10 - env: TEST_SUITE=simple -# There's a weird Yarn/Lerna bug related to prerelease versions. -# TODO: reenable after we ship 1.0. -# - node_js: 6 -# env: USE_YARN=yes TEST_SUITE=simple + env: TEST_SUITE=old-node + - node_js: 6 + env: TEST_SUITE=kitchensink diff --git a/.yarnrc b/.yarnrc new file mode 100644 index 00000000000..07e44a9a5b2 --- /dev/null +++ b/.yarnrc @@ -0,0 +1,3 @@ +--install.no-lockfile true +--install.check-files true +--add.no-lockfile true diff --git a/CHANGELOG.md b/CHANGELOG.md index f233de0ade8..a2dfec8fec6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,190 @@ +## 1.1.0 (January 15, 2018) + +#### :rocket: New Feature + +* `react-scripts` + + * [#3387](https://github.com/facebookincubator/create-react-app/pull/3387) Add support for variable expansion in `.env` files. ([@moos](https://github.com/moos)) + +* `react-error-overlay` + + * [#3474](https://github.com/facebookincubator/create-react-app/pull/3474) Allow the error overlay to be unregistered. ([@Timer](https://github.com/Timer)) + +* `create-react-app` + + * [#3408](https://github.com/facebookincubator/create-react-app/pull/3408) Add `--info` flag to help gather bug reports. ([@tabrindle](https://github.com/tabrindle)) + * [#3409](https://github.com/facebookincubator/create-react-app/pull/3409) Add `--use-npm` flag to bypass Yarn even on systems that have it. ([@tabrindle](https://github.com/tabrindle)) + * [#3725](https://github.com/facebookincubator/create-react-app/pull/3725) Extend `--scripts-version` to include `.tar.gz` format. ([@SaschaDens](https://github.com/SaschaDens)) + * [#3629](https://github.com/facebookincubator/create-react-app/pull/3629) Allowing `"file:"` `--scripts-version` values. ([@GreenGremlin](https://github.com/GreenGremlin)) + + +#### :bug: Bug Fix + +* `babel-preset-react-app`, `react-scripts` + + * [#3788](https://github.com/facebookincubator/create-react-app/pull/3788) Fix object destructuring inside an array on Node 6. ([@gaearon](https://github.com/gaearon)) + +* `react-dev-utils` + + * [#3784](https://github.com/facebookincubator/create-react-app/pull/3784) Detach browser process from the shell on Linux. ([@gaearon](https://github.com/gaearon)) + * [#3726](https://github.com/facebookincubator/create-react-app/pull/3726) Use proxy for all request methods other than `GET`. ([@doshisid](https://github.com/doshisid)) + * [#3440](https://github.com/facebookincubator/create-react-app/pull/3440) Print full directory name from `lsof`. ([@rmccue](https://github.com/rmccue)) + * [#2071](https://github.com/facebookincubator/create-react-app/pull/2071) Fix broken console clearing on Windows. ([@danielverejan](https://github.com/danielverejan)) + * [#3686](https://github.com/facebookincubator/create-react-app/pull/3686) Fix starting a project in directory with `++` in the name. ([@Norris1z](https://github.com/Norris1z)) + +* `create-react-app` + + * [#3320](https://github.com/facebookincubator/create-react-app/pull/3320) Fix offline installation to respect proxy from `.npmrc`. ([@mdogadailo](https://github.com/mdogadailo)) + +* `react-scripts` + + * [#3537](https://github.com/facebookincubator/create-react-app/pull/3537) Add `mjs` and `jsx` filename extensions to `file-loader` exclude pattern. ([@iansu](https://github.com/iansu)) + * [#3511](https://github.com/facebookincubator/create-react-app/pull/3511) Unmount the component in the default generated test. ([@gaearon](https://github.com/gaearon)) + +#### :nail_care: Enhancement + +* `react-scripts` + + * [#3730](https://github.com/facebookincubator/create-react-app/pull/3730) Print when `HOST` environment variable is set. ([@iansu](https://github.com/iansu)) + * [#3455](https://github.com/facebookincubator/create-react-app/pull/3455) Add a localhost-only log message pointing folks to the PWA docs. ([@jeffposnick](https://github.com/jeffposnick)) + * [#3416](https://github.com/facebookincubator/create-react-app/pull/3416) Improve eject message. ([@xjlim](https://github.com/xjlim)) + +* `create-react-app` + + * [#3740](https://github.com/facebookincubator/create-react-app/pull/3740) Allow more non-conflicting files in initial project directory. ([@GreenGremlin](https://github.com/GreenGremlin)) + +* `react-dev-utils` + + * [#3104](https://github.com/facebookincubator/create-react-app/pull/3104) Add link to deployment docs after build. ([@viankakrisna](https://github.com/viankakrisna)) + * [#3652](https://github.com/facebookincubator/create-react-app/pull/3652) Add `code-insiders` to the editor list. ([@shrynx](https://github.com/shrynx)) + * [#3700](https://github.com/facebookincubator/create-react-app/pull/3700) Add editor support for Sublime Dev & VSCode Insiders. ([@yyx990803](https://github.com/yyx990803)) + * [#3545](https://github.com/facebookincubator/create-react-app/pull/3545) Autodetect MacVim editor. ([@gnapse](https://github.com/gnapse)) + +* `react-dev-utils`, `react-error-overlay` + + * [#3465](https://github.com/facebookincubator/create-react-app/pull/3465) Open editor to exact column from build error overlay. ([@tharakawj](https://github.com/tharakawj)) + +* `react-dev-utils`, `react-scripts` + + * [#3721](https://github.com/facebookincubator/create-react-app/pull/3721) Support setting `none` in `REACT_EDITOR` environment variable. ([@raerpo](https://github.com/raerpo)) + +* `eslint-config-react-app` + + * [#3716](https://github.com/facebookincubator/create-react-app/pull/3716) Relax `no-cond-assign` rule. ([@gaearon](https://github.com/gaearon)) + +#### :memo: Documentation + +* User Guide + + * [#3659](https://github.com/facebookincubator/create-react-app/pull/3659) Add info about service-worker and HTTP caching headers into Firebase section. ([@bobrosoft](https://github.com/bobrosoft)) + * [#3515](https://github.com/facebookincubator/create-react-app/pull/3515) Add Powershell commands to README.md. ([@Gua-naiko-che](https://github.com/Gua-naiko-che)) + * [#3656](https://github.com/facebookincubator/create-react-app/pull/3656) Better documentation for setupTests.js when ejecting. ([@dannycalleri](https://github.com/dannycalleri)) + * [#1791](https://github.com/facebookincubator/create-react-app/pull/1791) Add link for automatic deployment to azure. ([@ulrikstrid](https://github.com/ulrikstrid)) + * [#3717](https://github.com/facebookincubator/create-react-app/pull/3717) Update README.md. ([@maecapozzi](https://github.com/maecapozzi)) + * [#3710](https://github.com/facebookincubator/create-react-app/pull/3710) Link to an explanation for forking react-scripts. ([@gaearon](https://github.com/gaearon)) + * [#3709](https://github.com/facebookincubator/create-react-app/pull/3709) Document adding a router. ([@gaearon](https://github.com/gaearon)) + * [#3670](https://github.com/facebookincubator/create-react-app/pull/3670) Fix typo in the User Guide. ([@qbahers](https://github.com/qbahers)) + * [#3645](https://github.com/facebookincubator/create-react-app/pull/3645) Update README.md. ([@elie222](https://github.com/elie222)) + * [#3533](https://github.com/facebookincubator/create-react-app/pull/3533) Use safer/more aesthetic syntax for setting environment variables on Windows. ([@cdanielsen](https://github.com/cdanielsen)) + * [#3605](https://github.com/facebookincubator/create-react-app/pull/3605) Updated Debugging Tests for VSCode. ([@amadeogallardo](https://github.com/amadeogallardo)) + * [#3601](https://github.com/facebookincubator/create-react-app/pull/3601) Fixed typo in webpack.config.dev.js. ([@nmenglund](https://github.com/nmenglund)) + * [#3576](https://github.com/facebookincubator/create-react-app/pull/3576) Updates comment to reflect codebase. ([@rahulcs](https://github.com/rahulcs)) + * [#3510](https://github.com/facebookincubator/create-react-app/pull/3510) Update User Guide with deploying to GitHub User pages. ([@aaronlna](https://github.com/aaronlna)) + * [#3503](https://github.com/facebookincubator/create-react-app/pull/3503) Update Prettier editor integration link. ([@gaving](https://github.com/gaving)) + * [#3453](https://github.com/facebookincubator/create-react-app/pull/3453) Fix dead links. ([@vannio](https://github.com/vannio)) + * [#2992](https://github.com/facebookincubator/create-react-app/pull/2992) Docs: How to Debug Unit Tests. ([@MattMorgis](https://github.com/MattMorgis)) + +* Other + + * [#3729](https://github.com/facebookincubator/create-react-app/pull/3729) Update README.md to note Neutrino's support of react components. ([@eliperelman](https://github.com/eliperelman)) + * [#2841](https://github.com/facebookincubator/create-react-app/pull/2841) Documentation to help windows contributors. ([@Dubes](https://github.com/Dubes)) + * [#3489](https://github.com/facebookincubator/create-react-app/pull/3489) Add link to nvm-windows. ([@davidgilbertson](https://github.com/davidgilbertson)) + +* `eslint-config-react-app` + + * [#3460](https://github.com/facebookincubator/create-react-app/pull/3460) Fix broken link to `href-no-hash` eslint rule. ([@hazolsky](https://github.com/hazolsky)) + +#### :house: Internal + +* Other + + * [#3769](https://github.com/facebookincubator/create-react-app/pull/3769) Enable Yarn check files. ([@Timer](https://github.com/Timer)) + * [#3756](https://github.com/facebookincubator/create-react-app/pull/3756) Clean up changes to npm and yarn registry in E2E tests. ([@viankakrisna](https://github.com/viankakrisna)) + * [#3744](https://github.com/facebookincubator/create-react-app/pull/3744) Use private registry in E2E tests. ([@Timer](https://github.com/Timer)) + * [#3738](https://github.com/facebookincubator/create-react-app/pull/3738) Always use Yarn on CI. ([@gaearon](https://github.com/gaearon)) + * [#2309](https://github.com/facebookincubator/create-react-app/pull/2309) Port `cra.sh` development task to javascript. ([@ianschmitz](https://github.com/ianschmitz)) + * [#3411](https://github.com/facebookincubator/create-react-app/pull/3411) Simplify waiting for app start in E2E tests. ([@xjlim](https://github.com/xjlim)) + * [#3755](https://github.com/facebookincubator/create-react-app/pull/3755) Switch to Yarn Workspaces. ([@gaearon](https://github.com/gaearon)) + * [#3757](https://github.com/facebookincubator/create-react-app/pull/3757) Try updating Flow. ([@gaearon](https://github.com/gaearon)) + * [#3414](https://github.com/facebookincubator/create-react-app/pull/3414) Export `dismissRuntimeErrors` function. ([@skidding](https://github.com/skidding)) + * [#3036](https://github.com/facebookincubator/create-react-app/pull/3036) Cleaning up `printHostingInstructions` a bit. ([@GreenGremlin](https://github.com/GreenGremlin)) + * [#3514](https://github.com/facebookincubator/create-react-app/pull/3514) Fix `FileSizeReporter` for multi build Webpack setups. ([@iiska](https://github.com/iiska)) + * [#3362](https://github.com/facebookincubator/create-react-app/pull/3362) Refactor extra watch options regex to `react-dev-utils`. ([@xjlim](https://github.com/xjlim)) + +#### Committers: 47 + +- Aaron Lamb ([aaronlna](https://github.com/aaronlna)) +- Ade Viankakrisna Fadlil ([viankakrisna](https://github.com/viankakrisna)) +- Amadeo Gallardo ([amadeogallardo](https://github.com/amadeogallardo)) +- Andy Kenward ([andykenward](https://github.com/andykenward)) +- Christian Danielsen ([cdanielsen](https://github.com/cdanielsen)) +- Clayton Ray ([iamclaytonray](https://github.com/iamclaytonray)) +- Dan Abramov ([gaearon](https://github.com/gaearon)) +- Daniel Verejan ([danielverejan](https://github.com/danielverejan)) +- Danny Calleri ([dannycalleri](https://github.com/dannycalleri)) +- David Boyne ([boyney123](https://github.com/boyney123)) +- David Gilbertson ([davidgilbertson](https://github.com/davidgilbertson)) +- Eli Perelman ([eliperelman](https://github.com/eliperelman)) +- Elie ([elie222](https://github.com/elie222)) +- Ernesto García ([gnapse](https://github.com/gnapse)) +- Evan You ([yyx990803](https://github.com/yyx990803)) +- Gavin Gilmour ([gaving](https://github.com/gaving)) +- Ian Schmitz ([ianschmitz](https://github.com/ianschmitz)) +- Ian Sutherland ([iansu](https://github.com/iansu)) +- JANG SUN HYUK ([wkdtjsgur100](https://github.com/wkdtjsgur100)) +- Jeffrey Posnick ([jeffposnick](https://github.com/jeffposnick)) +- Joe Haddad ([Timer](https://github.com/Timer)) +- Joe Lim ([xjlim](https://github.com/xjlim)) +- Jonathan ([GreenGremlin](https://github.com/GreenGremlin)) +- Juhamatti Niemelä ([iiska](https://github.com/iiska)) +- Mae Capozzi ([maecapozzi](https://github.com/maecapozzi)) +- Maksym Dogadailo ([mdogadailo](https://github.com/mdogadailo)) +- Mario Nebl ([marionebl](https://github.com/marionebl)) +- Matt Morgis ([MattMorgis](https://github.com/MattMorgis)) +- Misha Khokhlov ([hazolsky](https://github.com/hazolsky)) +- Moos ([moos](https://github.com/moos)) +- Nils Magnus Englund ([nmenglund](https://github.com/nmenglund)) +- Norris Oduro ([Norris1z](https://github.com/Norris1z)) +- Ovidiu Cherecheș ([skidding](https://github.com/skidding)) +- Quentin Bahers ([qbahers](https://github.com/qbahers)) +- Rafael E. Poveda ([raerpo](https://github.com/raerpo)) +- Rahul Chanila ([rahulcs](https://github.com/rahulcs)) +- Ryan McCue ([rmccue](https://github.com/rmccue)) +- Sascha Dens ([SaschaDens](https://github.com/SaschaDens)) +- Siddharth Doshi ([doshisid](https://github.com/doshisid)) +- Tao Gómez Gil ([Gua-naiko-che](https://github.com/Gua-naiko-che)) +- Tharaka Wijebandara ([tharakawj](https://github.com/tharakawj)) +- Trevor Brindle ([tabrindle](https://github.com/tabrindle)) +- Ulrik Strid ([ulrikstrid](https://github.com/ulrikstrid)) +- Vladimir Tolstikov ([bobrosoft](https://github.com/bobrosoft)) +- [Dubes](https://github.com/Dubes) +- [vannio](https://github.com/vannio) +- shrynx ([shrynx](https://github.com/shrynx)) + +### Migrating from 1.0.17 to 1.1.0 + +Inside any created project that has not been ejected, run: + +``` +npm install --save --save-exact react-scripts@1.1.0 +``` + +or + +``` +yarn add --exact react-scripts@1.1.0 +``` + ## 1.0.17 (November 3, 2017) #### :nail_care: Enhancement diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md new file mode 100644 index 00000000000..55203be746a --- /dev/null +++ b/CODE_OF_CONDUCT.md @@ -0,0 +1,3 @@ +# Code of Conduct + +Facebook has adopted a Code of Conduct that we expect project participants to adhere to. Please [read the full text](https://code.facebook.com/pages/876921332402685/open-source-code-of-conduct) so that you can understand what actions will and will not be tolerated. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 86b392f2f44..72994ebbf68 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -75,20 +75,18 @@ All functionality must be retained (and configuration given to the user) if they 1. Clone the repo with `git clone https://github.com/facebookincubator/create-react-app` -2. Run `npm install` in the root `create-react-app` folder. +2. Run `yarn` in the root `create-react-app` folder. -Once it is done, you can modify any file locally and run `npm start`, `npm test` or `npm run build` just like in a generated project. +Once it is done, you can modify any file locally and run `yarn start`, `yarn test` or `yarn build` just like in a generated project. If you want to try out the end-to-end flow with the global CLI, you can do this too: ``` -npm run create-react-app my-app +yarn create-react-app my-app cd my-app ``` -and then run `npm start` or `npm run build`. - -*Note: if you are using yarn, we suggest that you use `yarn install --no-lockfile` instead of the bare `yarn` or `yarn install` because we [intentionally](https://github.com/facebookincubator/create-react-app/pull/2014#issuecomment-300811661) do not ignore or add yarn.lock to our repo.* +and then run `yarn start` or `yarn build`. ## Contributing to E2E (end to end) tests @@ -96,6 +94,21 @@ and then run `npm start` or `npm run build`. More detailed information are in the dedicated [README](/packages/react-scripts/fixtures/kitchensink/README.md). +## Tips for contributors using Windows + +The scripts in tasks folder and other scripts in `package.json` will not work in Windows out of the box. However, using [Bash on windows](https://msdn.microsoft.com/en-us/commandline/wsl/about) makes it easier to use those scripts without any workarounds. The steps to do so are detailed below: + +### Install Bash on Ubuntu on Windows + +A good step by step guide can be found [here](https://www.howtogeek.com/249966/how-to-install-and-use-the-linux-bash-shell-on-windows-10/) + +### Install Node.js and yarn +Even if you have node and yarn installed on your windows, it would not be accessible from the bash shell. You would have to install it again. Installing via [`nvm`](https://github.com/creationix/nvm#install-script) is recommended. + +### Line endings + +By default git would use `CRLF` line endings which would cause the scripts to fail. You can change it for this repo only by setting `autocrlf` to false by running `git config core.autocrlf false`. You can also enable it for all your repos by using the `--global` flag if you wish to do so. + ## Cutting a Release 1. Tag all merged pull requests that go into the release with the relevant milestone. Each merged PR should also be labeled with one of the [labels](https://github.com/facebookincubator/create-react-app/labels) named `tag: ...` to indicate what kind of change it is. @@ -104,11 +117,11 @@ More detailed information are in the dedicated [README](/packages/react-scripts/ 4. Note that files in `packages/create-react-app` should be modified with extreme caution. Since it’s a global CLI, any version of `create-react-app` (global CLI) including very old ones should work with the latest version of `react-scripts`. 5. Create a change log entry for the release: * You'll need an [access token for the GitHub API](https://help.github.com/articles/creating-an-access-token-for-command-line-use/). Save it to this environment variable: `export GITHUB_AUTH="..."` - * Run `npm run changelog`. The command will find all the labeled pull requests merged since the last release and group them by the label and affected packages, and create a change log entry with all the changes and links to PRs and their authors. Copy and paste it to `CHANGELOG.md`. + * Run `yarn changelog`. The command will find all the labeled pull requests merged since the last release and group them by the label and affected packages, and create a change log entry with all the changes and links to PRs and their authors. Copy and paste it to `CHANGELOG.md`. * Add a four-space indented paragraph after each non-trivial list item, explaining what changed and why. For each breaking change also write who it affects and instructions for migrating existing code. * Maybe add some newlines here and there. Preview the result on GitHub to get a feel for it. Changelog generator output is a bit too terse for my taste, so try to make it visually pleasing and well grouped. 6. Make sure to include “Migrating from ...” instructions for the previous release. Often you can copy and paste them. -7. **Do not run `npm publish`. Instead, run `npm run publish`.** +7. Run `npm run publish`. (It has to be `npm run publish` exactly, not just `npm publish` or `yarn publish`.) 8. Wait for a long time, and it will get published. Don’t worry that it’s stuck. In the end the publish script will prompt for versions before publishing the packages. 9. After publishing, create a GitHub Release with the same text as the changelog entry. See previous Releases for inspiration. diff --git a/bootstrap.js b/bootstrap.js deleted file mode 100644 index b54a1ed9f36..00000000000 --- a/bootstrap.js +++ /dev/null @@ -1,67 +0,0 @@ -'use strict'; - -const { execSync, spawn } = require('child_process'); -const { resolve } = require('path'); -const { existsSync } = require('fs'); -const { platform } = require('os'); - -function shouldUseYarn() { - try { - execSync('yarnpkg --version', { stdio: 'ignore' }); - return true; - } catch (e) { - return false; - } -} - -function shouldUseNpmConcurrently() { - try { - const versionString = execSync('npm --version'); - const m = /^(\d+)[.]/.exec(versionString); - // NPM >= 5 support concurrent installs - return Number(m[1]) >= 5; - } catch (e) { - return false; - } -} - -const yarn = shouldUseYarn(); -const windows = platform() === 'win32'; -const lerna = resolve( - __dirname, - 'node_modules', - '.bin', - windows ? 'lerna.cmd' : 'lerna' -); - -if (!existsSync(lerna)) { - if (yarn) { - console.log('Cannot find lerna. Please run `yarn --check-files`.'); - } else { - console.log( - 'Cannot find lerna. Please remove `node_modules` and run `npm install`.' - ); - } - process.exit(1); -} - -let child; -if (yarn) { - // Yarn does not support concurrency - child = spawn(lerna, ['bootstrap', '--npm-client=yarn', '--concurrency=1'], { - stdio: 'inherit', - }); -} else { - let args = ['bootstrap']; - if ( - // The Windows filesystem does not handle concurrency well - windows || - // Only newer npm versions support concurrency - !shouldUseNpmConcurrently() - ) { - args.push('--concurrency=1'); - } - child = spawn(lerna, args, { stdio: 'inherit' }); -} - -child.on('close', code => process.exit(code)); diff --git a/lerna.json b/lerna.json index 1673f8a3187..f1d78d84bae 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,7 @@ { - "lerna": "2.0.0", + "lerna": "2.6.0", + "npmClient": "yarn", + "useWorkspaces": true, "version": "independent", "changelog": { "repo": "facebookincubator/create-react-app", @@ -12,8 +14,5 @@ "tag: internal": ":house: Internal" }, "cacheDir": ".changelog" - }, - "packages": [ - "packages/*" - ] + } } diff --git a/package.json b/package.json index 5758c6263af..9a32bc1350f 100644 --- a/package.json +++ b/package.json @@ -1,25 +1,30 @@ { "private": true, + "workspaces": [ + "packages/*" + ], "scripts": { - "build": "node packages/react-scripts/scripts/build.js", + "build": "cd packages/react-scripts && node scripts/build.js", "changelog": "lerna-changelog", - "create-react-app": "tasks/cra.sh", + "create-react-app": "node tasks/cra.js", "e2e": "tasks/e2e-simple.sh", "e2e:docker": "tasks/local-test.sh", - "postinstall": "node bootstrap.js && cd packages/react-error-overlay/ && npm run build:prod", - "publish": "tasks/release.sh", - "start": "node packages/react-scripts/scripts/start.js", - "test": "node packages/react-scripts/scripts/test.js --env=jsdom", + "postinstall": "cd packages/react-error-overlay/ && yarn build:prod", + "publish": "tasks/publish.sh", + "start": "cd packages/react-scripts && node scripts/start.js", + "screencast": "svg-term --cast hItN7sl5yfCPTHxvFg5glhhfp --out screencast.svg --window", + "test": "cd packages/react-scripts && node scripts/test.js --env=jsdom", "format": "prettier --trailing-comma es5 --single-quote --write 'packages/*/*.js' 'packages/*/!(node_modules)/**/*.js'", "precommit": "lint-staged" }, "devDependencies": { "eslint": "^4.4.1", "husky": "^0.13.2", - "lerna": "^2.0.0", + "lerna": "2.6.0", "lerna-changelog": "^0.6.0", "lint-staged": "^3.3.1", - "prettier": "1.6.1" + "prettier": "1.6.1", + "svg-term-cli": "^2.0.3" }, "lint-staged": { "*.js": [ diff --git a/packages/babel-preset-react-app/README.md b/packages/babel-preset-react-app/README.md index 4dc9fb9b168..5653831ac7e 100644 --- a/packages/babel-preset-react-app/README.md +++ b/packages/babel-preset-react-app/README.md @@ -16,6 +16,12 @@ If you want to use this Babel preset in a project not built with Create React Ap First, [install Babel](https://babeljs.io/docs/setup/). +Then install babel-preset-react-app. + +```sh +npm install babel-preset-react-app --save-dev +``` + Then create a file named `.babelrc` with following contents in the root folder of your project: ```js diff --git a/packages/babel-preset-react-app/index.js b/packages/babel-preset-react-app/index.js index 0d961af6f0f..d90fb6af50b 100644 --- a/packages/babel-preset-react-app/index.js +++ b/packages/babel-preset-react-app/index.js @@ -7,6 +7,10 @@ 'use strict'; const plugins = [ + // Necessary to include regardless of the environment because + // in practice some other transforms (such as object-rest-spread) + // don't work without it: https://github.com/babel/babel/issues/7215 + require.resolve('babel-plugin-transform-es2015-destructuring'), // class { handleClick = () => { } } require.resolve('babel-plugin-transform-class-properties'), // The following two plugins use Object.assign directly, instead of Babel's diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json index f020f99e0b8..c6a7e29441d 100644 --- a/packages/babel-preset-react-app/package.json +++ b/packages/babel-preset-react-app/package.json @@ -1,6 +1,6 @@ { "name": "babel-preset-react-app", - "version": "3.1.0", + "version": "3.1.1", "description": "Babel preset used by Create React App", "repository": "facebookincubator/create-react-app", "license": "MIT", @@ -14,6 +14,7 @@ "babel-plugin-dynamic-import-node": "1.1.0", "babel-plugin-syntax-dynamic-import": "6.18.0", "babel-plugin-transform-class-properties": "6.24.1", + "babel-plugin-transform-es2015-destructuring": "6.23.0", "babel-plugin-transform-object-rest-spread": "6.26.0", "babel-plugin-transform-react-constant-elements": "6.23.0", "babel-plugin-transform-react-jsx": "6.24.1", diff --git a/packages/create-react-app/createReactApp.js b/packages/create-react-app/createReactApp.js index e7dbbb35842..a2d9fdbd86b 100755 --- a/packages/create-react-app/createReactApp.js +++ b/packages/create-react-app/createReactApp.js @@ -47,6 +47,7 @@ const tmp = require('tmp'); const unpack = require('tar-pack').unpack; const url = require('url'); const hyperquest = require('hyperquest'); +const envinfo = require('envinfo'); const packageJson = require('./package.json'); @@ -60,6 +61,7 @@ const program = new commander.Command(packageJson.name) projectName = name; }) .option('--verbose', 'print additional logs') + .option('--info', 'print environment debug info') .option( '--scripts-version ', 'use a non-standard version of react-scripts' @@ -83,6 +85,11 @@ const program = new commander.Command(packageJson.name) 'https://mysite.com/my-react-scripts-0.8.2.tgz' )}` ); + console.log( + ` - a .tar.gz archive: ${chalk.green( + 'https://mysite.com/my-react-scripts-0.8.2.tar.gz' + )}` + ); console.log( ` It is not needed unless you specifically want to use a fork.` ); @@ -100,6 +107,14 @@ const program = new commander.Command(packageJson.name) .parse(process.argv); if (typeof projectName === 'undefined') { + if (program.info) { + envinfo.print({ + packages: ['react', 'react-dom', 'react-scripts'], + noNativeIDE: true, + duplicates: true, + }); + process.exit(0); + } console.error('Please specify the project directory:'); console.log( ` ${chalk.cyan(program.name())} ${chalk.green('')}` @@ -268,7 +283,7 @@ function run( template, useYarn ) { - const packageToInstall = getInstallPackage(version); + const packageToInstall = getInstallPackage(version, originalDirectory); const allDependencies = ['react', 'react-dom', packageToInstall]; console.log('Installing packages. This might take a couple of minutes.'); @@ -365,11 +380,16 @@ function run( }); } -function getInstallPackage(version) { +function getInstallPackage(version, originalDirectory) { let packageToInstall = 'react-scripts'; const validSemver = semver.valid(version); if (validSemver) { packageToInstall += `@${validSemver}`; + } else if (version && version.match(/^file:/)) { + packageToInstall = `file:${path.resolve( + originalDirectory, + version.match(/^file:(.*)?$/)[1] + )}`; } else if (version) { // for tar.gz or alternative paths packageToInstall = version; @@ -417,7 +437,7 @@ function extractStream(stream, dest) { // Extract package name from tarball url or path. function getPackageName(installPackage) { - if (installPackage.indexOf('.tgz') > -1) { + if (installPackage.match(/^.+\.(tgz|tar\.gz)$/)) { return getTemporaryDirectory() .then(obj => { let stream; @@ -440,7 +460,7 @@ function getPackageName(installPackage) { `Could not extract the package name from the archive: ${err.message}` ); const assumedProjectName = installPackage.match( - /^.+\/(.+?)(?:-\d+.+)?\.tgz$/ + /^.+\/(.+?)(?:-\d+.+)?\.(tgz|tar\.gz)$/ )[1]; console.log( `Based on the filename, assuming it is "${chalk.cyan( @@ -459,6 +479,10 @@ function getPackageName(installPackage) { return Promise.resolve( installPackage.charAt(0) + installPackage.substr(1).split('@')[0] ); + } else if (installPackage.match(/^file:/)) { + const installPackagePath = installPackage.match(/^file:(.*)?$/)[1]; + const installPackageJson = require(path.join(installPackagePath, 'package.json')); + return Promise.resolve(installPackageJson.name); } return Promise.resolve(installPackage); } @@ -595,6 +619,12 @@ function isSafeToCreateProjectIn(root, name) { '.hg', '.hgignore', '.hgcheck', + '.npmignore', + 'mkdocs.yml', + 'docs', + '.travis.yml', + '.gitlab-ci.yml', + '.gitattributes', ]; console.log(); @@ -620,6 +650,21 @@ function isSafeToCreateProjectIn(root, name) { return false; } +function getProxy() { + if (process.env.https_proxy) { + return process.env.https_proxy; + } else { + try { + // Trying to read https-proxy from .npmrc + let httpsProxy = execSync('npm config get https-proxy') + .toString() + .trim(); + return httpsProxy !== 'null' ? httpsProxy : undefined; + } catch (e) { + return; + } + } +} function checkThatNpmCanReadCwd() { const cwd = process.cwd(); let childOutput = null; @@ -690,10 +735,11 @@ function checkIfOnline(useYarn) { return new Promise(resolve => { dns.lookup('registry.yarnpkg.com', err => { - if (err != null && process.env.https_proxy) { + let proxy; + if (err != null && (proxy = getProxy())) { // If a proxy is defined, we likely can't resolve external hostnames. // Try to resolve the proxy name as an indication of a connection. - dns.lookup(url.parse(process.env.https_proxy).hostname, proxyErr => { + dns.lookup(url.parse(proxy).hostname, proxyErr => { resolve(proxyErr == null); }); } else { diff --git a/packages/create-react-app/package.json b/packages/create-react-app/package.json index 569985f5c07..65ab56a1698 100644 --- a/packages/create-react-app/package.json +++ b/packages/create-react-app/package.json @@ -1,6 +1,6 @@ { "name": "create-react-app", - "version": "1.4.3", + "version": "1.5.0", "keywords": [ "react" ], @@ -24,6 +24,7 @@ "chalk": "^1.1.1", "commander": "^2.9.0", "cross-spawn": "^4.0.0", + "envinfo": "^3.8.0", "fs-extra": "^1.0.0", "hyperquest": "^2.1.2", "semver": "^5.0.3", diff --git a/packages/eslint-config-react-app/index.js b/packages/eslint-config-react-app/index.js index adcdb86bc16..c7a619abd62 100644 --- a/packages/eslint-config-react-app/index.js +++ b/packages/eslint-config-react-app/index.js @@ -116,7 +116,7 @@ module.exports = { 'new-parens': 'warn', 'no-array-constructor': 'warn', 'no-caller': 'warn', - 'no-cond-assign': ['warn', 'always'], + 'no-cond-assign': ['warn', 'except-parens'], 'no-const-assign': 'warn', 'no-control-regex': 'warn', 'no-delete-var': 'warn', diff --git a/packages/eslint-config-react-app/package.json b/packages/eslint-config-react-app/package.json index a10ef679952..c13b0417c46 100644 --- a/packages/eslint-config-react-app/package.json +++ b/packages/eslint-config-react-app/package.json @@ -1,6 +1,6 @@ { "name": "eslint-config-react-app", - "version": "2.0.1", + "version": "2.1.0", "description": "ESLint configuration used by Create React App", "repository": "facebookincubator/create-react-app", "license": "MIT", diff --git a/packages/react-dev-utils/FileSizeReporter.js b/packages/react-dev-utils/FileSizeReporter.js index 01ce52c6b55..68aae411f12 100644 --- a/packages/react-dev-utils/FileSizeReporter.js +++ b/packages/react-dev-utils/FileSizeReporter.js @@ -25,21 +25,29 @@ function printFileSizesAfterBuild( ) { var root = previousSizeMap.root; var sizes = previousSizeMap.sizes; - var assets = webpackStats - .toJson() - .assets.filter(asset => /\.(js|css)$/.test(asset.name)) - .map(asset => { - var fileContents = fs.readFileSync(path.join(root, asset.name)); - var size = gzipSize(fileContents); - var previousSize = sizes[removeFileNameHash(root, asset.name)]; - var difference = getDifferenceLabel(size, previousSize); - return { - folder: path.join(path.basename(buildFolder), path.dirname(asset.name)), - name: path.basename(asset.name), - size: size, - sizeLabel: filesize(size) + (difference ? ' (' + difference + ')' : ''), - }; - }); + var assets = (webpackStats.stats || [webpackStats]) + .map(stats => + stats + .toJson() + .assets.filter(asset => /\.(js|css)$/.test(asset.name)) + .map(asset => { + var fileContents = fs.readFileSync(path.join(root, asset.name)); + var size = gzipSize(fileContents); + var previousSize = sizes[removeFileNameHash(root, asset.name)]; + var difference = getDifferenceLabel(size, previousSize); + return { + folder: path.join( + path.basename(buildFolder), + path.dirname(asset.name) + ), + name: path.basename(asset.name), + size: size, + sizeLabel: + filesize(size) + (difference ? ' (' + difference + ')' : '') + }; + }) + ) + .reduce((single, all) => all.concat(single), []); assets.sort((a, b) => b.size - a.size); var longestSizeLabelLength = Math.max.apply( null, diff --git a/packages/react-dev-utils/WebpackDevServerUtils.js b/packages/react-dev-utils/WebpackDevServerUtils.js index f19582e1227..4add9f9c1bc 100644 --- a/packages/react-dev-utils/WebpackDevServerUtils.js +++ b/packages/react-dev-utils/WebpackDevServerUtils.js @@ -317,15 +317,19 @@ function prepareProxy(proxy, appPublicFolder) { // For single page apps, we generally want to fallback to /index.html. // However we also want to respect `proxy` for API calls. // So if `proxy` is specified as a string, we need to decide which fallback to use. - // We use a heuristic: if request `accept`s text/html, we pick /index.html. + // We use a heuristic: We want to proxy all the requests that are not meant + // for static assets and as all the requests for static assets will be using + // `GET` method, we can proxy all non-`GET` requests. + // For `GET` requests, if request `accept`s text/html, we pick /index.html. // Modern browsers include text/html into `accept` header when navigating. // However API calls like `fetch()` won’t generally accept text/html. // If this heuristic doesn’t work well for you, use a custom `proxy` object. context: function(pathname, req) { return ( - mayProxy(pathname) && - req.headers.accept && - req.headers.accept.indexOf('text/html') === -1 + req.method !== 'GET' || + (mayProxy(pathname) && + req.headers.accept && + req.headers.accept.indexOf('text/html') === -1) ); }, onProxyReq: proxyReq => { diff --git a/packages/react-dev-utils/clearConsole.js b/packages/react-dev-utils/clearConsole.js index 6e3b3c9cefe..cb02af89237 100644 --- a/packages/react-dev-utils/clearConsole.js +++ b/packages/react-dev-utils/clearConsole.js @@ -8,9 +8,7 @@ 'use strict'; function clearConsole() { - process.stdout.write( - process.platform === 'win32' ? '\x1Bc' : '\x1B[2J\x1B[3J\x1B[H' - ); + process.stdout.write(process.platform === 'win32' ? '\x1B[2J\x1B[0f' : '\x1B[2J\x1B[3J\x1B[H'); } module.exports = clearConsole; diff --git a/packages/react-dev-utils/errorOverlayMiddleware.js b/packages/react-dev-utils/errorOverlayMiddleware.js index b756b0ef647..873b1994732 100644 --- a/packages/react-dev-utils/errorOverlayMiddleware.js +++ b/packages/react-dev-utils/errorOverlayMiddleware.js @@ -12,7 +12,9 @@ const launchEditorEndpoint = require('./launchEditorEndpoint'); module.exports = function createLaunchEditorMiddleware() { return function launchEditorMiddleware(req, res, next) { if (req.url.startsWith(launchEditorEndpoint)) { - launchEditor(req.query.fileName, req.query.lineNumber); + const lineNumber = parseInt(req.query.lineNumber, 10) || 1; + const colNumber = parseInt(req.query.colNumber, 10) || 1; + launchEditor(req.query.fileName, lineNumber, colNumber); res.end(); } else { next(); diff --git a/packages/react-dev-utils/getProcessForPort.js b/packages/react-dev-utils/getProcessForPort.js index 932f3e5bf4d..f9eda7752b4 100644 --- a/packages/react-dev-utils/getProcessForPort.js +++ b/packages/react-dev-utils/getProcessForPort.js @@ -58,7 +58,7 @@ function getProcessCommand(processId, processDirectory) { function getDirectoryOfProcessById(processId) { return execSync( - 'lsof -p ' + processId + ' | awk \'$4=="cwd" {print $9}\'', + 'lsof -p ' + processId + ' | awk \'$4=="cwd" {for (i=9; i<=NF; i++) printf "%s ", $i}\'', execOptions ).trim(); } diff --git a/packages/react-dev-utils/launchEditor.js b/packages/react-dev-utils/launchEditor.js index ba16827e644..cf190b08619 100644 --- a/packages/react-dev-utils/launchEditor.js +++ b/packages/react-dev-utils/launchEditor.js @@ -33,9 +33,13 @@ const COMMON_EDITORS_OSX = { '/Applications/Brackets.app/Contents/MacOS/Brackets': 'brackets', '/Applications/Sublime Text.app/Contents/MacOS/Sublime Text': '/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl', + '/Applications/Sublime Text Dev.app/Contents/MacOS/Sublime Text': + '/Applications/Sublime Text Dev.app/Contents/SharedSupport/bin/subl', '/Applications/Sublime Text 2.app/Contents/MacOS/Sublime Text 2': '/Applications/Sublime Text 2.app/Contents/SharedSupport/bin/subl', '/Applications/Visual Studio Code.app/Contents/MacOS/Electron': 'code', + '/Applications/Visual Studio Code - Insiders.app/Contents/MacOS/Electron': + 'code-insiders', '/Applications/AppCode.app/Contents/MacOS/appcode': '/Applications/AppCode.app/Contents/MacOS/appcode', '/Applications/CLion.app/Contents/MacOS/clion': @@ -52,12 +56,15 @@ const COMMON_EDITORS_OSX = { '/Applications/RubyMine.app/Contents/MacOS/rubymine', '/Applications/WebStorm.app/Contents/MacOS/webstorm': '/Applications/WebStorm.app/Contents/MacOS/webstorm', + '/Applications/MacVim.app/Contents/MacOS/MacVim': + 'mvim', }; const COMMON_EDITORS_LINUX = { atom: 'atom', Brackets: 'brackets', code: 'code', + 'code-insiders': 'code-insiders', emacs: 'emacs', 'idea.sh': 'idea', 'phpstorm.sh': 'phpstorm', @@ -71,6 +78,7 @@ const COMMON_EDITORS_LINUX = { const COMMON_EDITORS_WIN = [ 'Brackets.exe', 'Code.exe', + 'Code - Insiders.exe', 'atom.exe', 'sublime_text.exe', 'notepad++.exe', @@ -95,7 +103,13 @@ function addWorkspaceToArgumentsIfExists(args, workspace) { return args; } -function getArgumentsForLineNumber(editor, fileName, lineNumber, workspace) { +function getArgumentsForLineNumber( + editor, + fileName, + lineNumber, + colNumber, + workspace +) { const editorBasename = path.basename(editor).replace(/\.(exe|cmd|bat)$/i, ''); switch (editorBasename) { case 'atom': @@ -104,25 +118,29 @@ function getArgumentsForLineNumber(editor, fileName, lineNumber, workspace) { case 'subl': case 'sublime': case 'sublime_text': + return [fileName + ':' + lineNumber + ':' + colNumber]; case 'wstorm': case 'charm': return [fileName + ':' + lineNumber]; case 'notepad++': - return ['-n' + lineNumber, fileName]; + return ['-n' + lineNumber, '-c' + colNumber, fileName]; case 'vim': case 'mvim': case 'joe': + return ['+' + lineNumber, fileName]; case 'emacs': case 'emacsclient': - return ['+' + lineNumber, fileName]; + return ['+' + lineNumber + ':' + colNumber, fileName]; case 'rmate': case 'mate': case 'mine': return ['--line', lineNumber, fileName]; case 'code': case 'Code': + case 'code-insiders': + case 'Code - Insiders': return addWorkspaceToArgumentsIfExists( - ['-g', fileName + ':' + lineNumber], + ['-g', fileName + ':' + lineNumber + ':' + colNumber], workspace ); case 'appcode': @@ -245,23 +263,35 @@ function printInstructions(fileName, errorMessage) { } let _childProcess = null; -function launchEditor(fileName, lineNumber) { +function launchEditor(fileName, lineNumber, colNumber) { if (!fs.existsSync(fileName)) { return; } // Sanitize lineNumber to prevent malicious use on win32 // via: https://github.com/nodejs/node/blob/c3bb4b1aa5e907d489619fb43d233c3336bfc03d/lib/child_process.js#L333 - if (lineNumber && isNaN(lineNumber)) { + // and it should be a positive integer + if (!(Number.isInteger(lineNumber) && lineNumber > 0)) { return; } + // colNumber is optional, but should be a positive integer too + // default is 1 + if (!(Number.isInteger(colNumber) && colNumber > 0)) { + colNumber = 1; + } + let [editor, ...args] = guessEditor(); + if (!editor) { printInstructions(fileName, null); return; } + if (editor.toLowerCase() === 'none') { + return; + } + if ( process.platform === 'linux' && fileName.startsWith('/mnt/') && @@ -279,7 +309,13 @@ function launchEditor(fileName, lineNumber) { let workspace = null; if (lineNumber) { args = args.concat( - getArgumentsForLineNumber(editor, fileName, lineNumber, workspace) + getArgumentsForLineNumber( + editor, + fileName, + lineNumber, + colNumber, + workspace + ) ); } else { args.push(fileName); diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json index 54606f33fe8..18f37c971e4 100644 --- a/packages/react-dev-utils/package.json +++ b/packages/react-dev-utils/package.json @@ -1,6 +1,6 @@ { "name": "react-dev-utils", - "version": "4.2.1", + "version": "5.0.0", "description": "Webpack utilities used by Create React App", "repository": "facebookincubator/create-react-app", "license": "MIT", @@ -40,15 +40,15 @@ "babel-code-frame": "6.26.0", "chalk": "1.1.3", "cross-spawn": "5.1.0", - "detect-port-alt": "1.1.3", + "detect-port-alt": "1.1.5", "escape-string-regexp": "1.0.5", "filesize": "3.5.11", "global-modules": "1.0.0", "gzip-size": "3.0.0", "inquirer": "3.3.0", "is-root": "1.0.0", - "opn": "5.1.0", - "react-error-overlay": "^3.0.0", + "opn": "5.2.0", + "react-error-overlay": "^4.0.0", "recursive-readdir": "2.2.1", "shell-quote": "1.6.1", "sockjs-client": "1.1.4", diff --git a/packages/react-dev-utils/printHostingInstructions.js b/packages/react-dev-utils/printHostingInstructions.js index 4a080dba2c9..4f761dfb0d0 100644 --- a/packages/react-dev-utils/printHostingInstructions.js +++ b/packages/react-dev-utils/printHostingInstructions.js @@ -19,118 +19,108 @@ function printHostingInstructions( buildFolder, useYarn ) { - const publicPathname = url.parse(publicPath).pathname; - if (publicUrl && publicUrl.indexOf('.github.io/') !== -1) { + if (publicUrl && publicUrl.includes('.github.io/')) { // "homepage": "http://user.github.io/project" + const publicPathname = url.parse(publicPath).pathname; + const hasDeployScript = typeof appPackage.scripts.deploy !== 'undefined'; + printBaseMessage(buildFolder, publicPathname); + + printDeployInstructions(publicUrl, hasDeployScript, useYarn); + } else if (publicPath !== '/') { + // "homepage": "http://mywebsite.com/project" + printBaseMessage(buildFolder, publicPath); + } else { + // "homepage": "http://mywebsite.com" + // or no homepage + printBaseMessage(buildFolder, publicUrl); + + printStaticServerInstructions(buildFolder, useYarn); + } + console.log(); + console.log('Find out more about deployment here:'); + console.log(); + console.log(` ${chalk.yellow('http://bit.ly/2vY88Kr')}`); + console.log(); +} + +function printBaseMessage(buildFolder, hostingLocation) { + console.log( + `The project was built assuming it is hosted at ${chalk.green( + hostingLocation || 'the server root' + )}.` + ); + console.log( + `You can control this with the ${chalk.green( + 'homepage' + )} field in your ${chalk.cyan('package.json')}.` + ); + + if (!hostingLocation) { + console.log('For example, add this to build it for GitHub Pages:'); + console.log(); + console.log( - `The project was built assuming it is hosted at ${chalk.green( - publicPathname - )}.` - ); - console.log( - `You can control this with the ${chalk.green( - 'homepage' - )} field in your ${chalk.cyan('package.json')}.` + ` ${chalk.green('"homepage"')} ${chalk.cyan(':')} ${chalk.green( + '"http://myname.github.io/myapp"' + )}${chalk.cyan(',')}` ); - console.log(); - console.log(`The ${chalk.cyan('build')} folder is ready to be deployed.`); - console.log(`To publish it at ${chalk.green(publicUrl)}, run:`); - // If script deploy has been added to package.json, skip the instructions - if (typeof appPackage.scripts.deploy === 'undefined') { - console.log(); - if (useYarn) { - console.log(` ${chalk.cyan('yarn')} add --dev gh-pages`); - } else { - console.log(` ${chalk.cyan('npm')} install --save-dev gh-pages`); - } - console.log(); - console.log( - `Add the following script in your ${chalk.cyan('package.json')}.` - ); - console.log(); - console.log(` ${chalk.dim('// ...')}`); - console.log(` ${chalk.yellow('"scripts"')}: {`); - console.log(` ${chalk.dim('// ...')}`); - console.log( - ` ${chalk.yellow('"predeploy"')}: ${chalk.yellow( - '"npm run build",' - )}` - ); - console.log( - ` ${chalk.yellow('"deploy"')}: ${chalk.yellow( - '"gh-pages -d build"' - )}` - ); - console.log(' }'); - console.log(); - console.log('Then run:'); + } + console.log(); + console.log(`The ${chalk.cyan(buildFolder)} folder is ready to be deployed.`); +} + +function printDeployInstructions(publicUrl, hasDeployScript, useYarn) { + console.log(`To publish it at ${chalk.green(publicUrl)}, run:`); + console.log(); + + // If script deploy has been added to package.json, skip the instructions + if (!hasDeployScript) { + if (useYarn) { + console.log(` ${chalk.cyan('yarn')} add --dev gh-pages`); + } else { + console.log(` ${chalk.cyan('npm')} install --save-dev gh-pages`); } console.log(); - console.log(` ${chalk.cyan(useYarn ? 'yarn' : 'npm')} run deploy`); + + console.log( + `Add the following script in your ${chalk.cyan('package.json')}.` + ); console.log(); - } else if (publicPath !== '/') { - // "homepage": "http://mywebsite.com/project" + + console.log(` ${chalk.dim('// ...')}`); + console.log(` ${chalk.yellow('"scripts"')}: {`); + console.log(` ${chalk.dim('// ...')}`); console.log( - `The project was built assuming it is hosted at ${chalk.green( - publicPath - )}.` + ` ${chalk.yellow('"predeploy"')}: ${chalk.yellow( + '"npm run build",' + )}` ); console.log( - `You can control this with the ${chalk.green( - 'homepage' - )} field in your ${chalk.cyan('package.json')}.` + ` ${chalk.yellow('"deploy"')}: ${chalk.yellow( + '"gh-pages -d build"' + )}` ); + console.log(' }'); console.log(); - console.log(`The ${chalk.cyan('build')} folder is ready to be deployed.`); + + console.log('Then run:'); console.log(); - } else { - if (publicUrl) { - // "homepage": "http://mywebsite.com" - console.log( - `The project was built assuming it is hosted at ${chalk.green( - publicUrl - )}.` - ); - console.log( - `You can control this with the ${chalk.green( - 'homepage' - )} field in your ${chalk.cyan('package.json')}.` - ); - console.log(); + } + console.log(` ${chalk.cyan(useYarn ? 'yarn' : 'npm')} run deploy`); +} + +function printStaticServerInstructions(buildFolder, useYarn) { + console.log('You may serve it with a static server:'); + console.log(); + + if (!fs.existsSync(`${globalModules}/serve`)) { + if (useYarn) { + console.log(` ${chalk.cyan('yarn')} global add serve`); } else { - // no homepage - console.log( - 'The project was built assuming it is hosted at the server root.' - ); - console.log( - `To override this, specify the ${chalk.green( - 'homepage' - )} in your ${chalk.cyan('package.json')}.` - ); - console.log('For example, add this to build it for GitHub Pages:'); - console.log(); - console.log( - ` ${chalk.green('"homepage"')} ${chalk.cyan(':')} ${chalk.green( - '"http://myname.github.io/myapp"' - )}${chalk.cyan(',')}` - ); - console.log(); + console.log(` ${chalk.cyan('npm')} install -g serve`); } - console.log( - `The ${chalk.cyan(buildFolder)} folder is ready to be deployed.` - ); - console.log('You may serve it with a static server:'); - console.log(); - if (!fs.existsSync(`${globalModules}/serve`)) { - if (useYarn) { - console.log(` ${chalk.cyan('yarn')} global add serve`); - } else { - console.log(` ${chalk.cyan('npm')} install -g serve`); - } - } - console.log(` ${chalk.cyan('serve')} -s ${buildFolder}`); - console.log(); } + console.log(` ${chalk.cyan('serve')} -s ${buildFolder}`); } module.exports = printHostingInstructions; diff --git a/packages/react-dev-utils/webpackHotDevClient.js b/packages/react-dev-utils/webpackHotDevClient.js index 296e380467d..cbbc80029ae 100644 --- a/packages/react-dev-utils/webpackHotDevClient.js +++ b/packages/react-dev-utils/webpackHotDevClient.js @@ -30,7 +30,9 @@ ErrorOverlay.setEditorHandler(function editorHandler(errorLocation) { '?fileName=' + window.encodeURIComponent(errorLocation.fileName) + '&lineNumber=' + - window.encodeURIComponent(errorLocation.lineNumber || 1) + window.encodeURIComponent(errorLocation.lineNumber || 1) + + '&colNumber=' + + window.encodeURIComponent(errorLocation.colNumber || 1) ); }); diff --git a/packages/react-error-overlay/.flowconfig b/packages/react-error-overlay/.flowconfig index 8d7de784e29..c976167c2a9 100644 --- a/packages/react-error-overlay/.flowconfig +++ b/packages/react-error-overlay/.flowconfig @@ -1,9 +1,15 @@ -[ignore] -.*/node_modules/eslint-plugin-jsx-a11y/.* - [include] -src/**/*.js +/src/**/*.js + +[ignore] +.*/node_modules/.* +.*/.git/.* +.*/__test__/.* +.*/fixtures/.* [libs] +flow/ [options] +module.file_ext=.js +sharedmemory.hash_table_pow=19 diff --git a/packages/react-error-overlay/flow/env.js b/packages/react-error-overlay/flow/env.js new file mode 100644 index 00000000000..12b151f5e4b --- /dev/null +++ b/packages/react-error-overlay/flow/env.js @@ -0,0 +1,19 @@ +declare module 'anser' { + declare module.exports: any; +} + +declare module 'babel-code-frame' { + declare module.exports: any; +} + +declare module 'html-entities' { + declare module.exports: any; +} + +declare module 'settle-promise' { + declare module.exports: any; +} + +declare module 'source-map' { + declare module.exports: any; +} diff --git a/packages/react-error-overlay/package.json b/packages/react-error-overlay/package.json index d4e528ea6c6..87099dd5e82 100644 --- a/packages/react-error-overlay/package.json +++ b/packages/react-error-overlay/package.json @@ -1,12 +1,12 @@ { "name": "react-error-overlay", - "version": "3.0.0", + "version": "4.0.0", "description": "An overlay for displaying stack frames.", "main": "lib/index.js", "scripts": { "prepublishOnly": "npm run build:prod && npm test", "start": "cross-env NODE_ENV=development node build.js --watch", - "test": "flow && cross-env NODE_ENV=test jest", + "test": "cross-env NODE_ENV=test jest", "build": "cross-env NODE_ENV=development node build.js", "build:prod": "cross-env NODE_ENV=production node build.js" }, @@ -35,18 +35,18 @@ "babel-core": "^6.26.0", "babel-eslint": "7.2.3", "babel-loader": "^7.1.2", - "babel-preset-react-app": "^3.1.0", + "babel-preset-react-app": "^3.1.1", "babel-runtime": "6.26.0", "chalk": "^2.1.0", "chokidar": "^1.7.0", "cross-env": "5.0.5", "eslint": "4.4.1", - "eslint-config-react-app": "^2.0.1", + "eslint-config-react-app": "^2.1.0", "eslint-plugin-flowtype": "2.35.0", "eslint-plugin-import": "2.7.0", "eslint-plugin-jsx-a11y": "5.1.1", "eslint-plugin-react": "7.1.0", - "flow-bin": "^0.54.0", + "flow-bin": "^0.63.1", "html-entities": "1.2.1", "jest": "20.0.4", "jest-fetch-mock": "1.2.1", diff --git a/packages/react-error-overlay/src/utils/parseCompileError.js b/packages/react-error-overlay/src/utils/parseCompileError.js index 2c9b6e60ebb..e87c45622c1 100644 --- a/packages/react-error-overlay/src/utils/parseCompileError.js +++ b/packages/react-error-overlay/src/utils/parseCompileError.js @@ -4,6 +4,7 @@ import Anser from 'anser'; export type ErrorLocation = {| fileName: string, lineNumber: number, + colNumber?: number, |}; const filePathRegex = /^\.(\/[^/\n ]+)+\.[^/\n ]+$/; @@ -25,6 +26,7 @@ function parseCompileError(message: string): ?ErrorLocation { const lines: Array = message.split('\n'); let fileName: string = ''; let lineNumber: number = 0; + let colNumber: number = 0; for (let i = 0; i < lines.length; i++) { const line: string = Anser.ansiToText(lines[i]).trim(); @@ -41,6 +43,8 @@ function parseCompileError(message: string): ?ErrorLocation { const match: ?Array = line.match(lineNumberRegexes[k]); if (match) { lineNumber = parseInt(match[1], 10); + // colNumber starts with 0 and hence add 1 + colNumber = parseInt(match[2], 10) + 1 || 1; break; } k++; @@ -51,7 +55,7 @@ function parseCompileError(message: string): ?ErrorLocation { } } - return fileName && lineNumber ? { fileName, lineNumber } : null; + return fileName && lineNumber ? { fileName, lineNumber, colNumber } : null; } export default parseCompileError; diff --git a/packages/react-scripts/config/env.js b/packages/react-scripts/config/env.js index fa42747f6a8..ceda79604e7 100644 --- a/packages/react-scripts/config/env.js +++ b/packages/react-scripts/config/env.js @@ -35,13 +35,16 @@ var dotenvFiles = [ // Load environment variables from .env* files. Suppress warnings using silent // if this file is missing. dotenv will never modify any environment variables -// that have already been set. +// that have already been set. Variable expansion is supported in .env files. // https://github.com/motdotla/dotenv +// https://github.com/motdotla/dotenv-expand dotenvFiles.forEach(dotenvFile => { if (fs.existsSync(dotenvFile)) { - require('dotenv').config({ - path: dotenvFile, - }); + require('dotenv-expand')( + require('dotenv').config({ + path: dotenvFile, + }) + ); } }); diff --git a/packages/react-scripts/fixtures/kitchensink/.env b/packages/react-scripts/fixtures/kitchensink/.env index 3e2f7b14a73..9f7acc60233 100644 --- a/packages/react-scripts/fixtures/kitchensink/.env +++ b/packages/react-scripts/fixtures/kitchensink/.env @@ -1,3 +1,7 @@ REACT_APP_X = x-from-original-env REACT_APP_ORIGINAL_1 = from-original-env-1 REACT_APP_ORIGINAL_2 = from-original-env-2 +REACT_APP_BASIC = basic +REACT_APP_BASIC_EXPAND = ${REACT_APP_BASIC} +REACT_APP_BASIC_EXPAND_SIMPLE = $REACT_APP_BASIC +REACT_APP_EXPAND_EXISTING = $REACT_APP_SHELL_ENV_MESSAGE diff --git a/packages/react-scripts/fixtures/kitchensink/integration/env.test.js b/packages/react-scripts/fixtures/kitchensink/integration/env.test.js index 5138bc513b3..43badcbde8e 100644 --- a/packages/react-scripts/fixtures/kitchensink/integration/env.test.js +++ b/packages/react-scripts/fixtures/kitchensink/integration/env.test.js @@ -67,5 +67,22 @@ describe('Integration', () => { doc.getElementById('feature-shell-env-variables').textContent ).to.equal('fromtheshell.'); }); + + it('expand .env variables', async () => { + const doc = await initDOM('expand-env-variables'); + + expect(doc.getElementById('feature-expand-env-1').textContent).to.equal( + 'basic' + ); + expect(doc.getElementById('feature-expand-env-2').textContent).to.equal( + 'basic' + ); + expect(doc.getElementById('feature-expand-env-3').textContent).to.equal( + 'basic' + ); + expect( + doc.getElementById('feature-expand-env-existing').textContent + ).to.equal('fromtheshell'); + }); }); }); diff --git a/packages/react-scripts/fixtures/kitchensink/src/App.js b/packages/react-scripts/fixtures/kitchensink/src/App.js index 5fe13accf25..0a1663192ee 100644 --- a/packages/react-scripts/fixtures/kitchensink/src/App.js +++ b/packages/react-scripts/fixtures/kitchensink/src/App.js @@ -179,6 +179,11 @@ class App extends Component { this.setFeature(f.default) ); break; + case 'expand-env-variables': + import('./features/env/ExpandEnvVariables').then(f => + this.setFeature(f.default) + ); + break; default: throw new Error(`Missing feature "${feature}"`); } diff --git a/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.js b/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.js new file mode 100644 index 00000000000..58fc00e3a5c --- /dev/null +++ b/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.js @@ -0,0 +1,21 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; + +export default () => ( + + {process.env.REACT_APP_BASIC} + {process.env.REACT_APP_BASIC_EXPAND} + + {process.env.REACT_APP_BASIC_EXPAND_SIMPLE} + + + {process.env.REACT_APP_EXPAND_EXISTING} + + +); diff --git a/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.test.js b/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.test.js new file mode 100644 index 00000000000..4e4200abee8 --- /dev/null +++ b/packages/react-scripts/fixtures/kitchensink/src/features/env/ExpandEnvVariables.test.js @@ -0,0 +1,17 @@ +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; +import ReactDOM from 'react-dom'; +import ExpandEnvVariables from './ExpandEnvVariables'; + +describe('expand .env variables', () => { + it('renders without crashing', () => { + const div = document.createElement('div'); + ReactDOM.render(, div); + }); +}); diff --git a/packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.js b/packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.js index be519175f69..14b06f7a4cc 100644 --- a/packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.js +++ b/packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.js @@ -40,7 +40,9 @@ export default class extends Component { return (
{this.state.users.map(user => { - const { id, name } = user; + const { id, ...rest } = user; + // eslint-disable-next-line no-unused-vars + const [{ name, ...innerRest }] = [{ ...rest }]; return
{name}
; })}
diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index a29dd2123d7..73c2baae682 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -35,6 +35,7 @@ "chalk": "1.1.3", "css-loader": "0.28.7", "dotenv": "4.0.0", + "dotenv-expand": "4.0.1", "eslint": "~4.15.0", "eslint-config-airbnb": "^16.1.0", "eslint-import-resolver-webpack": "^0.8.1", @@ -61,7 +62,7 @@ "postcss-loader": "2.0.8", "promise": "8.0.1", "raf": "3.4.0", - "react-dev-utils": "^4.2.1", + "react-dev-utils": "^5.0.0", "style-loader": "0.19.0", "sw-precache-webpack-plugin": "0.11.4", "url-loader": "0.6.2", diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js index 7eb7ad464c0..3ff1b91f435 100644 --- a/packages/react-scripts/scripts/start.js +++ b/packages/react-scripts/scripts/start.js @@ -51,6 +51,21 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) { const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000; const HOST = process.env.HOST || '0.0.0.0'; +if (process.env.HOST) { + console.log( + chalk.cyan( + `Attempting to bind to HOST environment variable: ${chalk.yellow( + chalk.bold(process.env.HOST) + )}` + ) + ); + console.log( + `If this was unintentional, check that you haven't mistakenly set it in your shell.` + ); + console.log(`Learn more here: ${chalk.yellow('http://bit.ly/2mwWSwH')}`); + console.log(); +} + // We attempt to use the default port but if it is busy, we offer the user to // run on a different port. `choosePort()` Promise resolves to the next free port. choosePort(HOST, DEFAULT_PORT) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 95cf966a643..7c641456056 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -13,6 +13,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [npm test](#npm-test) - [npm run build](#npm-run-build) - [npm run eject](#npm-run-eject) +- [Supported Browsers](#supported-browsers) - [Supported Language Features and Polyfills](#supported-language-features-and-polyfills) - [Syntax Highlighting in the Editor](#syntax-highlighting-in-the-editor) - [Displaying Lint Output in the Editor](#displaying-lint-output-in-the-editor) @@ -34,11 +35,13 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Adding Bootstrap](#adding-bootstrap) - [Using a Custom Theme](#using-a-custom-theme) - [Adding Flow](#adding-flow) +- [Adding a Router](#adding-a-router) - [Adding Custom Environment Variables](#adding-custom-environment-variables) - [Referencing Environment Variables in the HTML](#referencing-environment-variables-in-the-html) - [Adding Temporary Environment Variables In Your Shell](#adding-temporary-environment-variables-in-your-shell) - [Adding Development Environment Variables In `.env`](#adding-development-environment-variables-in-env) - [Can I Use Decorators?](#can-i-use-decorators) +- [Fetching Data with AJAX Requests](#fetching-data-with-ajax-requests) - [Integrating with an API Backend](#integrating-with-an-api-backend) - [Node](#node) - [Ruby on Rails](#ruby-on-rails) @@ -65,9 +68,12 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Snapshot Testing](#snapshot-testing) - [Editor Integration](#editor-integration) - [Debugging Tests](#debugging-tests) + - [Debugging Tests in Chrome](#debugging-tests-in-chrome) + - [Debugging Tests in Visual Studio Code](#debugging-tests-in-visual-studio-code) - [Developing Components in Isolation](#developing-components-in-isolation) - [Getting Started with Storybook](#getting-started-with-storybook) - [Getting Started with Styleguidist](#getting-started-with-styleguidist) +- [Publishing Components to npm](#publishing-components-to-npm) - [Making a Progressive Web App](#making-a-progressive-web-app) - [Opting Out of Caching](#opting-out-of-caching) - [Offline-First Considerations](#offline-first-considerations) @@ -94,6 +100,7 @@ You can find the most recent version of this guide [here](https://github.com/fac - [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku) - [`npm run build` fails to minify](#npm-run-build-fails-to-minify) - [Moment.js locales are missing](#momentjs-locales-are-missing) +- [Alternatives to Ejecting](#alternatives-to-ejecting) - [Something Missing?](#something-missing) ## Updating to New Releases @@ -191,6 +198,12 @@ Instead, it will copy all the configuration files and the transitive dependencie You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. +## Supported Browsers + +By default, the generated project uses the latest version of React. + +You can refer [to the React documentation](https://reactjs.org/docs/react-dom.html#browser-support) for more information about supported browsers. + ## Supported Language Features and Polyfills This project supports a superset of the latest JavaScript standard.
@@ -215,6 +228,8 @@ Note that **the project only includes a few ES6 [polyfills](https://en.wikipedia If you use any other ES6+ features that need **runtime support** (such as `Array.from()` or `Symbol`), make sure you are including the appropriate polyfills manually, or that the browsers you are targeting already support them. +Also note that using some newer syntax features like `for...of` or `[...nonArrayValue]` causes Babel to emit code that depends on ES6 runtime features and might not work without a polyfill. When in doubt, use [Babel REPL](https://babeljs.io/repl/) to see what any specific syntax compiles down to. + ## Syntax Highlighting in the Editor To configure the syntax highlighting in your favorite text editor, head to the [relevant Babel documentation page](https://babeljs.io/docs/editors) and follow the instructions. Some of the most popular editors are covered. @@ -463,6 +478,8 @@ You can also use it with `async` / `await` syntax if you prefer it. If you are using React Router check out [this tutorial](http://serverless-stack.com/chapters/code-splitting-in-create-react-app.html) on how to use code splitting with it. You can find the companion GitHub repository [here](https://github.com/AnomalyInnovations/serverless-stack-demo-client/tree/code-splitting-in-create-react-app). +Also check out the [Code Splitting](https://reactjs.org/docs/code-splitting.html) section in React documentation. + ## Adding a Stylesheet This project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**: @@ -804,6 +821,26 @@ In the future we plan to integrate it into Create React App even more closely. To learn more about Flow, check out [its documentation](https://flowtype.org/). +## Adding a Router + +Create React App doesn't prescribe a specific routing solution, but [React Router](https://reacttraining.com/react-router/) is the most popular one. + +To add it, run: + +```sh +npm install --save react-router-dom +``` + +Alternatively you may use `yarn`: + +```sh +yarn add react-router-dom +``` + +To try it, delete all the code in `src/App.js` and replace it with any of the examples on its website. The [Basic Example](https://reacttraining.com/react-router/web/example/basic) is a good place to get started. + +Note that [you may need to configure your production server to support client-side routing](#serving-apps-with-client-side-routing) before deploying your app. + ## Adding Custom Environment Variables >Note: this feature is available with `react-scripts@0.2.3` and higher. @@ -895,6 +932,12 @@ set "REACT_APP_SECRET_CODE=abcdef" && npm start (Note: Quotes around the variable assignment are required to avoid a trailing whitespace.) +#### Windows (Powershell) + +```Powershell +($env:REACT_APP_SECRET_CODE = "abcdef") -and (npm start) +``` + #### Linux, macOS (Bash) ```bash @@ -910,6 +953,7 @@ To define permanent environment variables, create a file called `.env` in the ro ``` REACT_APP_SECRET_CODE=abcdef ``` +>Note: You must create custom environment variables beginning with `REACT_APP_`. Any other variables except `NODE_ENV` will be ignored to avoid [accidentally exposing a private key on the machine that could have the same name](https://github.com/facebookincubator/create-react-app/issues/865#issuecomment-252199527). Changing any environment variables will require you to restart the development server if it is running. `.env` files **should be** checked into source control (with the exclusion of `.env*.local`). @@ -934,6 +978,28 @@ Please refer to the [dotenv documentation](https://github.com/motdotla/dotenv) f >Note: If you are defining environment variables for development, your CI and/or hosting platform will most likely need these defined as well. Consult their documentation how to do this. For example, see the documentation for [Travis CI](https://docs.travis-ci.com/user/environment-variables/) or [Heroku](https://devcenter.heroku.com/articles/config-vars). +#### Expanding Environment Variables In `.env` + +>Note: this feature is available with `react-scripts@1.1.0` and higher. + +Expand variables already on your machine for use in your `.env` file (using [dotenv-expand](https://github.com/motdotla/dotenv-expand)). + +For example, to get the environment variable `npm_package_version`: + +``` +REACT_APP_VERSION=$npm_package_version +# also works: +# REACT_APP_VERSION=${npm_package_version} +``` + +Or expand variables local to the current `.env` file: + +``` +DOMAIN=www.example.com +REACT_APP_FOO=$DOMAIN/foo +REACT_APP_BAR=$DOMAIN/bar +``` + ## Can I Use Decorators? Many popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.
@@ -951,6 +1017,16 @@ Please refer to these two threads for reference: Create React App will add decorator support when the specification advances to a stable stage. +## Fetching Data with AJAX Requests + +React doesn't prescribe a specific approach to data fetching, but people commonly use either a library like [axios](https://github.com/axios/axios) or the [`fetch()` API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) provided by the browser. Conveniently, Create React App includes a polyfill for `fetch()` so you can use it without worrying about the browser support. + +The global `fetch` function allows to easily makes AJAX requests. It takes in a URL as an input and returns a `Promise` that resolves to a `Response` object. You can find more information about `fetch` [here](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch). + +This project also includes a [Promise polyfill](https://github.com/then/promise) which provides a full implementation of Promises/A+. A Promise represents the eventual result of an asynchronous operation, you can find more information about Promises [here](https://www.promisejs.org/) and [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise). Both axios and `fetch()` use Promises under the hood. You can also use the [`async / await`](https://davidwalsh.name/async-await) syntax to reduce the callback nesting. + +You can learn more about making AJAX requests from React components in [the FAQ entry on the React website](https://reactjs.org/docs/faq-ajax.html). + ## Integrating with an API Backend These tutorials will help you to integrate your app with an API backend running on another port, @@ -1131,6 +1207,12 @@ To do this, set the `HTTPS` environment variable to `true`, then start the dev s set HTTPS=true&&npm start ``` +#### Windows (Powershell) + +```Powershell +($env:HTTPS = $true) -and (npm start) +``` + (Note: the lack of whitespace is intentional.) #### Linux, macOS (Bash) @@ -1286,6 +1368,8 @@ import Adapter from 'enzyme-adapter-react-16'; configure({ adapter: new Adapter() }); ``` +>Note: Keep in mind that if you decide to "eject" before creating `src/setupTests.js`, the resulting `package.json` file won't contain any reference to it. [Read here](#initializing-test-environment) to learn how to add this after ejecting. + Now you can write a smoke test with it: ```js @@ -1320,7 +1404,7 @@ it('renders welcome message', () => { All Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/en/expect.html).
Nevertheless you can use a third-party assertion library like [Chai](http://chaijs.com/) if you want to, as described below. -Additionally, you might find [jest-enzyme](https://github.com/blainekasten/enzyme-matchers) helpful to simplify your tests with readable matchers. The above `contains` code can be written simpler with jest-enzyme. +Additionally, you might find [jest-enzyme](https://github.com/blainekasten/enzyme-matchers) helpful to simplify your tests with readable matchers. The above `contains` code can be written more simply with jest-enzyme. ```js expect(wrapper).toContainReact(welcome) @@ -1375,6 +1459,15 @@ const localStorageMock = { global.localStorage = localStorageMock ``` +>Note: Keep in mind that if you decide to "eject" before creating `src/setupTests.js`, the resulting `package.json` file won't contain any reference to it, so you should manually create the property `setupTestFrameworkScriptFile` in the configuration for Jest, something like the following: + +>```js +>"jest": { +> // ... +> "setupTestFrameworkScriptFile": "/src/setupTests.js" +> } +> ``` + ### Focusing and Excluding Tests You can replace `it()` with `xit()` to temporarily exclude a test from being executed.
@@ -1468,6 +1561,16 @@ set CI=true&&npm run build (Note: the lack of whitespace is intentional.) +##### Windows (Powershell) + +```Powershell +($env:CI = $true) -and (npm test) +``` + +```Powershell +($env:CI = $true) -and (npm run build) +``` + ##### Linux, macOS (Bash) ```bash @@ -1668,6 +1771,10 @@ Learn more about React Styleguidist: * [GitHub Repo](https://github.com/styleguidist/react-styleguidist) * [Documentation](https://react-styleguidist.js.org/docs/getting-started.html) +## Publishing Components to npm + +Create React App doesn't provide any built-in functionality to publish a component to npm. If you're ready to extract a component from your project so other people can use it, we recommend moving it to a separate directory outside of your project and then using a tool like [nwb](https://github.com/insin/nwb#react-components-and-libraries) to prepare it for publishing. + ## Making a Progressive Web App By default, the production build is a fully functional, offline-first @@ -1939,6 +2046,8 @@ This will make sure that all the asset paths are relative to `index.html`. You w See [this](https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321) blog post on how to deploy your React app to Microsoft Azure. +See [this](https://medium.com/@strid/host-create-react-app-on-azure-986bc40d5bf2#.pycfnafbg) blog post or [this](https://github.com/ulrikaugustsson/azure-appservice-static) repo for a way to use automatic deployment to Azure App Service. + ### [Firebase](https://firebase.google.com/) Install the Firebase CLI if you haven’t already by running `npm install -g firebase-tools`. Sign up for a [Firebase account](https://console.firebase.google.com/) and create a new project. Run `firebase login` and login with your previous created Firebase account. @@ -1980,6 +2089,18 @@ Then run the `firebase init` command from your project’s root. You need to cho ✔ Firebase initialization complete! ``` +IMPORTANT: you need to set proper HTTP caching headers for `service-worker.js` file in `firebase.json` file or you will not be able to see changes after first deployment ([issue #2440](https://github.com/facebookincubator/create-react-app/issues/2440)). It should be added inside `"hosting"` key like next: + +``` +{ + "hosting": { + ... + "headers": [ + {"source": "/service-worker.js", "headers": [{"key": "Cache-Control", "value": "no-cache"}]} + ] + ... +``` + Now, after you create a production build with `npm run build`, you can deploy it by running `firebase deploy`. ```sh @@ -2203,9 +2324,10 @@ PORT | :white_check_mark: | :x: | By default, the development web server will at HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode. PUBLIC_URL | :x: | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application. CI | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default. -REACT_EDITOR | :white_check_mark: | :x: | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](https://en.wikipedia.org/wiki/PATH_(variable)) environment variable points to your editor’s bin folder. +REACT_EDITOR | :white_check_mark: | :x: | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](https://en.wikipedia.org/wiki/PATH_(variable)) environment variable points to your editor’s bin folder. You can also set it to `none` to disable it completely. CHOKIDAR_USEPOLLING | :white_check_mark: | :x: | When set to `true`, the watcher runs in polling mode, as necessary inside a VM. Use this option if `npm start` isn't detecting changes. GENERATE_SOURCEMAP | :x: | :white_check_mark: | When set to `false`, source maps are not generated for a production build. This solves OOM issues on some smaller machines. +NODE_PATH | :white_check_mark: | :white_check_mark: | Same as [`NODE_PATH` in Node.js](https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders), but only relative folders are allowed. Can be handy for emulating a monorepo setup by setting `NODE_PATH=src`. ## Troubleshooting @@ -2218,7 +2340,7 @@ If this doesn’t happen, try one of the following workarounds: * If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebookincubator/create-react-app/issues/1164) due to a Webpack bug. * Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor). * If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42). -* On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers. +* On Linux and macOS, you might need to [tweak system settings](https://github.com/webpack/docs/wiki/troubleshooting#not-enough-watchers) to allow more watchers. * If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesn’t exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM. If none of these solutions help please leave a comment [in this thread](https://github.com/facebookincubator/create-react-app/issues/659). @@ -2302,6 +2424,10 @@ To resolve this: In the future, we might start automatically compiling incompatible third-party modules, but it is not currently supported. This approach would also slow down the production builds. +## Alternatives to Ejecting + +[Ejecting](#npm-run-eject) lets you customize anything, but from that point on you have to maintain the configuration and scripts yourself. This can be daunting if you have many similar projects. In such cases instead of ejecting we recommend to *fork* `react-scripts` and any other packages you need. [This article](https://auth0.com/blog/how-to-configure-create-react-app/) dives into how to do it in depth. You can find more discussion in [this issue](https://github.com/facebookincubator/create-react-app/issues/682). + ## Something Missing? If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md) diff --git a/screencast.svg b/screencast.svg new file mode 100644 index 00000000000..d92ef4c6105 --- /dev/null +++ b/screencast.svg @@ -0,0 +1 @@ +~λλcλcλcreate-react-appmy-appCreatinganewReactappin~/my-app.Installingpackages.Thismighttakeacoupleofminutes.Installingreact,react-dom,andreact-scripts...yarnaddv1.2.1infoNolockfilefound.[1/4]🔍Resolvingpackages...[2/4]🚚Fetchingpackages...[3/4]🔗Linkingdependencies...[4/4]📃Buildingfreshpackages...✨Donein13.46s.Success!Createdmy-appat~/my-appInsidethatdirectory,youcanrunseveralcommands:yarnstartStartsthedevelopmentserver.yarnbuildBundlestheappintostaticfilesforproduction.yarntestStartsthetestrunner.yarnejectRemovesthistoolandcopiesbuilddependencies,configurationfilesandscriptsintotheappdirectory.Ifyoudothis,youcan’tgoback!Wesuggestthatyoubeginbytyping:cdmy-appHappyhacking!~14sλcdmy-app/λcdmy-app/~/my-appλyarnstartλyarnstartyarnrunv1.2.1Compiledsuccessfully!Youcannowviewmy-appinthebrowser.Local:http://localhost:3000/OnYourNetwork:http://192.168.178.58:3000/Notethatthedevelopmentbuildisnotoptimized.Tocreateaproductionbuild,useyarnbuild.λcrλcreate-react-appmy-appλcreate-react-appmy-appλcreate-react-appmy-appλcreate-react-appmy-appλcreate-react-appmy-appλcreate-react-appmy-appλcreate-react-appmy-appλcdλcdλcdmy-app/λcdmy-app/λcdmy-app/λyλyλyarnstartλyarnstartλyarnstartλyarnstartλyarnstartλyarnstartλyarnstartλyarnstartλyarnstart$react-scriptsstartStartingthedevelopmentserver...Compiling... \ No newline at end of file diff --git a/tasks/cra.js b/tasks/cra.js new file mode 100644 index 00000000000..ec15d702ac5 --- /dev/null +++ b/tasks/cra.js @@ -0,0 +1,109 @@ +#!/usr/bin/env node +/** + * Copyright (c) 2015-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +'use strict'; + +const fs = require('fs'); +const path = require('path'); +const cp = require('child_process'); + +const cleanup = () => { + console.log('Cleaning up.'); + // Uncomment when snapshot testing is enabled by default: + // rm ./template/src/__snapshots__/App.test.js.snap +}; + +const handleExit = () => { + cleanup(); + console.log('Exiting without error.'); + process.exit(); +}; + +const handleError = e => { + console.error('ERROR! An error was encountered while executing\n', e); + cleanup(); + console.log('Exiting with error.'); + process.exit(1); +}; + +process.on('SIGINT', handleExit); +process.on('uncaughtException', handleError); + +// ****************************************************************************** +// Pack react- scripts so we can verify they work. +// ****************************************************************************** + +const rootDir = path.join(__dirname, '..'); +const reactScriptsDir = path.join(rootDir, 'packages', 'react-scripts'); +const packageJsonPath = path.join(reactScriptsDir, 'package.json'); +const packageJsonOrigPath = path.join(reactScriptsDir, 'package.json.orig'); + +// Install all our packages +const lernaPath = path.join(rootDir, 'node_modules', '.bin', 'lerna'); +cp.execSync(`${lernaPath} bootstrap`, { + cwd: rootDir, + stdio: 'inherit', +}); + +// Save package.json because we're going to touch it +fs.writeFileSync(packageJsonOrigPath, fs.readFileSync(packageJsonPath)); + +// Replace own dependencies (those in the`packages` dir) with the local paths +// of those packages +const replaceOwnDepsPath = path.join(__dirname, 'replace-own-deps.js'); +cp.execSync(`node ${replaceOwnDepsPath}`, { stdio: 'inherit' }); + +// Finally, pack react-scripts +// Don't redirect stdio as we want to capture the output that will be returned +// from execSync(). In this case it will be the .tgz filename. +const scriptsFileName = cp + .execSync(`npm pack`, { cwd: reactScriptsDir }) + .toString() + .trim(); +const scriptsPath = path.join( + rootDir, + 'packages', + 'react-scripts', + scriptsFileName +); + +// Restore package.json +fs.unlinkSync(packageJsonPath); +fs.writeFileSync(packageJsonPath, fs.readFileSync(packageJsonOrigPath)); +fs.unlinkSync(packageJsonOrigPath); + +// ****************************************************************************** +// Now that we have packed them, call the global CLI. +// ****************************************************************************** + +// If Yarn is installed, clean its cache because it may have cached react-scripts +try { + cp.execSync('yarn cache clean'); +} catch (e) { + // We can safely ignore this as the user doesn't have yarn installed +} + +const args = process.argv.slice(2); + +// Now run the CRA command +const craScriptPath = path.join( + rootDir, + 'packages', + 'create-react-app', + 'index.js' +); +cp.execSync( + `node ${craScriptPath} --scripts-version="${scriptsPath}" ${args.join(' ')}`, + { + cwd: rootDir, + stdio: 'inherit', + } +); + +// Cleanup +handleExit(); diff --git a/tasks/cra.sh b/tasks/cra.sh deleted file mode 100755 index 7929cdbf5af..00000000000 --- a/tasks/cra.sh +++ /dev/null @@ -1,84 +0,0 @@ -#!/bin/bash -# Copyright (c) 2015-present, Facebook, Inc. -# -# This source code is licensed under the MIT license found in the -# LICENSE file in the root directory of this source tree. - -# ****************************************************************************** -# This creates an app with the global CLI and `react-scripts` from the source. -# It is useful for testing the end-to-end flow locally. -# ****************************************************************************** - -# Start in tasks/ even if run from root directory -cd "$(dirname "$0")" - -function cleanup { - echo 'Cleaning up.' - # Uncomment when snapshot testing is enabled by default: - # rm ./template/src/__snapshots__/App.test.js.snap -} - -# Error messages are redirected to stderr -function handle_error { - echo "$(basename $0): ERROR! An error was encountered executing line $1." 1>&2; - cleanup - echo 'Exiting with error.' 1>&2; - exit 1 -} - -function handle_exit { - cleanup - echo 'Exiting without error.' 1>&2; - exit -} - -# Exit the script with a helpful error message when any error is encountered -trap 'set +x; handle_error $LINENO $BASH_COMMAND' ERR - -# Cleanup before exit on any termination signal -trap 'set +x; handle_exit' SIGQUIT SIGTERM SIGINT SIGKILL SIGHUP - -# Echo every command being executed -set -x - -# Go to root -cd .. -root_path=$PWD - -# ****************************************************************************** -# Pack react-scripts so we can verify they work. -# ****************************************************************************** - -# Install all our packages -"$root_path"/node_modules/.bin/lerna bootstrap - -cd packages/react-scripts - -# Save package.json because we're going to touch it -cp package.json package.json.orig - -# Replace own dependencies (those in the `packages` dir) with the local paths -# of those packages. -node "$root_path"/tasks/replace-own-deps.js - -# Finally, pack react-scripts -scripts_path="$root_path"/packages/react-scripts/`npm pack` - -# Restore package.json -rm package.json -mv package.json.orig package.json - - -# ****************************************************************************** -# Now that we have packed them, call the global CLI. -# ****************************************************************************** - -# If Yarn is installed, clean its cache because it may have cached react-scripts -yarn cache clean || true - -# Go back to the root directory and run the command from here -cd "$root_path" -node packages/create-react-app/index.js --scripts-version="$scripts_path" "$@" - -# Cleanup -cleanup diff --git a/tasks/e2e-installs.sh b/tasks/e2e-installs.sh index 489cadb37c9..bcd616f3601 100755 --- a/tasks/e2e-installs.sh +++ b/tasks/e2e-installs.sh @@ -14,13 +14,17 @@ cd "$(dirname "$0")" # CLI and app temporary locations # http://unix.stackexchange.com/a/84980 -temp_cli_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_cli_path'` temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` +custom_registry_url=http://localhost:4873 +original_npm_registry_url=`npm get registry` +original_yarn_registry_url=`yarn config get registry` function cleanup { echo 'Cleaning up.' cd "$root_path" - rm -rf "$temp_cli_path" "$temp_app_path" + rm -rf "$temp_app_path" + npm set registry "$original_npm_registry_url" + yarn config set registry "$original_yarn_registry_url" } # Error messages are redirected to stderr @@ -55,10 +59,6 @@ function checkDependencies { fi } -function create_react_app { - node "$temp_cli_path"/node_modules/create-react-app/index.js $* -} - # Exit the script with a helpful error message when any error is encountered trap 'set +x; handle_error $LINENO $BASH_COMMAND' ERR @@ -72,77 +72,47 @@ set -x cd .. root_path=$PWD -# Clear cache to avoid issues with incorrect packages being used -if hash yarnpkg 2>/dev/null -then - # AppVeyor uses an old version of yarn. - # Once updated to 0.24.3 or above, the workaround can be removed - # and replaced with `yarnpkg cache clean` - # Issues: - # https://github.com/yarnpkg/yarn/issues/2591 - # https://github.com/appveyor/ci/issues/1576 - # https://github.com/facebookincubator/create-react-app/pull/2400 - # When removing workaround, you may run into - # https://github.com/facebookincubator/create-react-app/issues/2030 - case "$(uname -s)" in - *CYGWIN*|MSYS*|MINGW*) yarn=yarn.cmd;; - *) yarn=yarnpkg;; - esac - $yarn cache clean -fi - if hash npm 2>/dev/null then - # npm 5 is too buggy right now - if [ $(npm -v | head -c 1) -eq 5 ]; then - npm i -g npm@^4.x - fi; + npm i -g npm@latest npm cache clean || npm cache verify fi -# Prevent bootstrap, we only want top-level dependencies -cp package.json package.json.bak -grep -v "postinstall" package.json > temp && mv temp package.json -npm install -mv package.json.bak package.json - -if [ "$USE_YARN" = "yes" ] -then - # Install Yarn so that the test can use it to install packages. - npm install -g yarn - yarn cache clean -fi - -# We removed the postinstall, so do it manually -node bootstrap.js - -cd packages/react-error-overlay/ -npm run build:prod -cd ../.. +# Bootstrap monorepo +yarn # ****************************************************************************** -# First, pack and install create-react-app. +# First, publish the monorepo. # ****************************************************************************** -# Pack CLI -cd "$root_path"/packages/create-react-app -cli_path=$PWD/`npm pack` +# Start local registry +tmp_registry_log=`mktemp` +nohup npx verdaccio@2.7.2 &>$tmp_registry_log & +# Wait for `verdaccio` to boot +grep -q 'http address' <(tail -f $tmp_registry_log) + +# Set registry to local registry +npm set registry "$custom_registry_url" +yarn config set registry "$custom_registry_url" + +# Login so we can publish packages +npx npm-cli-login@0.0.10 -u user -p password -e user@example.com -r "$custom_registry_url" --quotes -# Install the CLI in a temporary location -cd "$temp_cli_path" -npm install "$cli_path" +# Publish the monorepo +git clean -df +./tasks/publish.sh --yes --force-publish=* --skip-git --cd-version=prerelease --exact --npm-tag=latest # ****************************************************************************** # Test --scripts-version with a version number # ****************************************************************************** cd "$temp_app_path" -create_react_app --scripts-version=0.4.0 test-app-version-number +npx create-react-app --scripts-version=1.0.17 test-app-version-number cd test-app-version-number # Check corresponding scripts version is installed. exists node_modules/react-scripts -grep '"version": "0.4.0"' node_modules/react-scripts/package.json +grep '"version": "1.0.17"' node_modules/react-scripts/package.json checkDependencies # ****************************************************************************** @@ -150,13 +120,13 @@ checkDependencies # ****************************************************************************** cd "$temp_app_path" -create_react_app --use-npm --scripts-version=0.4.0 test-use-npm-flag +npx create-react-app --use-npm --scripts-version=1.0.17 test-use-npm-flag cd test-use-npm-flag # Check corresponding scripts version is installed. exists node_modules/react-scripts [ ! -e "yarn.lock" ] && echo "yarn.lock correctly does not exist" -grep '"version": "0.4.0"' node_modules/react-scripts/package.json +grep '"version": "1.0.17"' node_modules/react-scripts/package.json checkDependencies # ****************************************************************************** @@ -164,12 +134,12 @@ checkDependencies # ****************************************************************************** cd "$temp_app_path" -create_react_app --scripts-version=https://registry.npmjs.org/react-scripts/-/react-scripts-0.4.0.tgz test-app-tarball-url +npx create-react-app --scripts-version=https://registry.npmjs.org/react-scripts/-/react-scripts-1.0.17.tgz test-app-tarball-url cd test-app-tarball-url # Check corresponding scripts version is installed. exists node_modules/react-scripts -grep '"version": "0.4.0"' node_modules/react-scripts/package.json +grep '"version": "1.0.17"' node_modules/react-scripts/package.json checkDependencies # ****************************************************************************** @@ -177,7 +147,7 @@ checkDependencies # ****************************************************************************** cd "$temp_app_path" -create_react_app --scripts-version=react-scripts-fork test-app-fork +npx create-react-app --scripts-version=react-scripts-fork test-app-fork cd test-app-fork # Check corresponding scripts version is installed. @@ -189,7 +159,7 @@ exists node_modules/react-scripts-fork cd "$temp_app_path" # we will install a non-existing package to simulate a failed installataion. -create_react_app --scripts-version=`date +%s` test-app-should-not-exist || true +npx create-react-app --scripts-version=`date +%s` test-app-should-not-exist || true # confirm that the project folder was deleted test ! -d test-app-should-not-exist @@ -201,7 +171,7 @@ cd "$temp_app_path" mkdir test-app-should-remain echo '## Hello' > ./test-app-should-remain/README.md # we will install a non-existing package to simulate a failed installataion. -create_react_app --scripts-version=`date +%s` test-app-should-remain || true +npx create-react-app --scripts-version=`date +%s` test-app-should-remain || true # confirm the file exist test -e test-app-should-remain/README.md # confirm only README.md is the only file in the directory @@ -215,7 +185,7 @@ fi cd $temp_app_path curl "https://registry.npmjs.org/@enoah_netzach/react-scripts/-/react-scripts-0.9.0.tgz" -o enoah-scripts-0.9.0.tgz -create_react_app --scripts-version=$temp_app_path/enoah-scripts-0.9.0.tgz test-app-scoped-fork-tgz +npx create-react-app --scripts-version=$temp_app_path/enoah-scripts-0.9.0.tgz test-app-scoped-fork-tgz cd test-app-scoped-fork-tgz # Check corresponding scripts version is installed. @@ -230,22 +200,22 @@ cd "$temp_app_path" mkdir test-app-nested-paths-t1 cd test-app-nested-paths-t1 mkdir -p test-app-nested-paths-t1/aa/bb/cc/dd -create_react_app test-app-nested-paths-t1/aa/bb/cc/dd +npx create-react-app test-app-nested-paths-t1/aa/bb/cc/dd cd test-app-nested-paths-t1/aa/bb/cc/dd -npm start -- --smoke-test +yarn start --smoke-test # Testing a path that does not exist cd "$temp_app_path" -create_react_app test-app-nested-paths-t2/aa/bb/cc/dd +npx create-react-app test-app-nested-paths-t2/aa/bb/cc/dd cd test-app-nested-paths-t2/aa/bb/cc/dd -npm start -- --smoke-test +yarn start --smoke-test # Testing a path that is half exists cd "$temp_app_path" mkdir -p test-app-nested-paths-t3/aa -create_react_app test-app-nested-paths-t3/aa/bb/cc/dd +npx create-react-app test-app-nested-paths-t3/aa/bb/cc/dd cd test-app-nested-paths-t3/aa/bb/cc/dd -npm start -- --smoke-test +yarn start --smoke-test # Cleanup cleanup diff --git a/tasks/e2e-kitchensink.sh b/tasks/e2e-kitchensink.sh index 547821b652a..d73c45ddbfa 100755 --- a/tasks/e2e-kitchensink.sh +++ b/tasks/e2e-kitchensink.sh @@ -14,16 +14,20 @@ cd "$(dirname "$0")" # CLI, app, and test module temporary locations # http://unix.stackexchange.com/a/84980 -temp_cli_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_cli_path'` temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` temp_module_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_module_path'` +custom_registry_url=http://localhost:4873 +original_npm_registry_url=`npm get registry` +original_yarn_registry_url=`yarn config get registry` function cleanup { echo 'Cleaning up.' ps -ef | grep 'react-scripts' | grep -v grep | awk '{print $2}' | xargs kill -9 cd "$root_path" # TODO: fix "Device or resource busy" and remove ``|| $CI` - rm -rf "$temp_cli_path" "$temp_app_path" "$temp_module_path" || $CI + rm -rf "$temp_app_path" "$temp_module_path" || $CI + npm set registry "$original_npm_registry_url" + yarn config set registry "$original_yarn_registry_url" } # Error messages are redirected to stderr @@ -40,35 +44,6 @@ function handle_exit { exit } -function create_react_app { - node "$temp_cli_path"/node_modules/create-react-app/index.js "$@" -} - -function install_package { - local pkg=$(basename $1) - - # Clean target (for safety) - rm -rf node_modules/$pkg/ - rm -rf node_modules/**/$pkg/ - - # Copy package into node_modules/ ignoring installed deps - # rsync -a ${1%/} node_modules/ --exclude node_modules - cp -R ${1%/} node_modules/ - rm -rf node_modules/$pkg/node_modules/ - - # Install `dependencies` - cd node_modules/$pkg/ - if [ "$USE_YARN" = "yes" ] - then - yarn install --production - else - npm install --only=production - fi - # Remove our packages to ensure side-by-side versions are used (which we link) - rm -rf node_modules/{babel-preset-react-app,eslint-config-react-app,react-dev-utils,react-error-overlay,react-scripts} - cd ../.. -} - # Check for the existence of one or more files. function exists { for f in $*; do @@ -89,94 +64,47 @@ set -x cd .. root_path=$PWD -# Clear cache to avoid issues with incorrect packages being used -if hash yarnpkg 2>/dev/null -then - # AppVeyor uses an old version of yarn. - # Once updated to 0.24.3 or above, the workaround can be removed - # and replaced with `yarnpkg cache clean` - # Issues: - # https://github.com/yarnpkg/yarn/issues/2591 - # https://github.com/appveyor/ci/issues/1576 - # https://github.com/facebookincubator/create-react-app/pull/2400 - # When removing workaround, you may run into - # https://github.com/facebookincubator/create-react-app/issues/2030 - case "$(uname -s)" in - *CYGWIN*|MSYS*|MINGW*) yarn=yarn.cmd;; - *) yarn=yarnpkg;; - esac - $yarn cache clean -fi - if hash npm 2>/dev/null then - # npm 5 is too buggy right now - if [ $(npm -v | head -c 1) -eq 5 ]; then - npm i -g npm@^4.x - fi; + npm i -g npm@latest npm cache clean || npm cache verify fi -# Prevent bootstrap, we only want top-level dependencies -cp package.json package.json.bak -grep -v "postinstall" package.json > temp && mv temp package.json -npm install -mv package.json.bak package.json - -if [ "$USE_YARN" = "yes" ] -then - # Install Yarn so that the test can use it to install packages. - npm install -g yarn - yarn cache clean -fi - -# We removed the postinstall, so do it manually -node bootstrap.js - -cd packages/react-error-overlay/ -npm run build:prod -cd ../.. +# Bootstrap monorepo +yarn # ****************************************************************************** -# First, pack react-scripts and create-react-app so we can use them. +# First, publish the monorepo. # ****************************************************************************** -# Pack CLI -cd "$root_path"/packages/create-react-app -cli_path=$PWD/`npm pack` - -# Go to react-scripts -cd "$root_path"/packages/react-scripts +# Start local registry +tmp_registry_log=`mktemp` +nohup npx verdaccio@2.7.2 &>$tmp_registry_log & +# Wait for `verdaccio` to boot +grep -q 'http address' <(tail -f $tmp_registry_log) -# Save package.json because we're going to touch it -cp package.json package.json.orig +# Set registry to local registry +npm set registry "$custom_registry_url" +yarn config set registry "$custom_registry_url" -# Replace own dependencies (those in the `packages` dir) with the local paths -# of those packages. -node "$root_path"/tasks/replace-own-deps.js +# Login so we can publish packages +npx npm-cli-login@0.0.10 -u user -p password -e user@example.com -r "$custom_registry_url" --quotes -# Finally, pack react-scripts -scripts_path="$root_path"/packages/react-scripts/`npm pack` - -# Restore package.json -rm package.json -mv package.json.orig package.json +# Publish the monorepo +git clean -df +./tasks/publish.sh --yes --force-publish=* --skip-git --cd-version=prerelease --exact --npm-tag=latest # ****************************************************************************** -# Now that we have packed them, create a clean app folder and install them. +# Now that we have published them, create a clean app folder and install them. # ****************************************************************************** -# Install the CLI in a temporary location -cd "$temp_cli_path" -npm install "$cli_path" - # Install the app in a temporary location cd $temp_app_path -create_react_app --scripts-version="$scripts_path" --internal-testing-template="$root_path"/packages/react-scripts/fixtures/kitchensink test-kitchensink +npx create-react-app --internal-testing-template="$root_path"/packages/react-scripts/fixtures/kitchensink test-kitchensink # Install the test module cd "$temp_module_path" -npm install test-integrity@^2.0.1 +yarn add test-integrity@^2.0.1 # ****************************************************************************** # Now that we used create-react-app to create an app depending on react-scripts, @@ -186,20 +114,14 @@ npm install test-integrity@^2.0.1 # Enter the app directory cd "$temp_app_path/test-kitchensink" -# Link to our preset -install_package "$root_path"/packages/babel-preset-react-app -# Link to error overlay package because now it's a dependency -# of react-dev-utils and not react-scripts -install_package "$root_path"/packages/react-error-overlay - # Link to test module -install_package "$temp_module_path/node_modules/test-integrity" +npm link "$temp_module_path/node_modules/test-integrity" # Test the build REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ NODE_PATH=src \ PUBLIC_URL=http://www.example.org/spa/ \ - npm run build + yarn build # Check for expected output exists build/*.html @@ -210,14 +132,14 @@ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ CI=true \ NODE_PATH=src \ NODE_ENV=test \ - npm test -- --no-cache --testPathPattern=src + yarn test --no-cache --testPathPattern=src # Test "development" environment tmp_server_log=`mktemp` PORT=3001 \ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ NODE_PATH=src \ - nohup npm start &>$tmp_server_log & + nohup yarn start &>$tmp_server_log & grep -q 'You can now view' <(tail -f $tmp_server_log) E2E_URL="http://localhost:3001" \ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ @@ -240,28 +162,14 @@ E2E_FILE=./build/index.html \ # Eject... echo yes | npm run eject -# Ensure Yarn is ran after eject; at the time of this commit, we don't run Yarn -# after ejecting. Soon, we may only skip Yarn on Windows. Let's try to remove -# this in the near future. -if hash yarnpkg 2>/dev/null -then - yarn install --check-files -fi - -# ...but still link to the local packages -install_package "$root_path"/packages/babel-preset-react-app -install_package "$root_path"/packages/eslint-config-react-app -install_package "$root_path"/packages/react-error-overlay -install_package "$root_path"/packages/react-dev-utils - # Link to test module -install_package "$temp_module_path/node_modules/test-integrity" +npm link "$temp_module_path/node_modules/test-integrity" # Test the build REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ NODE_PATH=src \ PUBLIC_URL=http://www.example.org/spa/ \ - npm run build + yarn build # Check for expected output exists build/*.html @@ -272,14 +180,14 @@ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ CI=true \ NODE_PATH=src \ NODE_ENV=test \ - npm test -- --no-cache --testPathPattern=src + yarn test --no-cache --testPathPattern=src # Test "development" environment tmp_server_log=`mktemp` PORT=3002 \ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ NODE_PATH=src \ - nohup npm start &>$tmp_server_log & + nohup yarn start &>$tmp_server_log & grep -q 'You can now view' <(tail -f $tmp_server_log) E2E_URL="http://localhost:3002" \ REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \ diff --git a/tasks/e2e-old-node.sh b/tasks/e2e-old-node.sh new file mode 100755 index 00000000000..8245dd24e50 --- /dev/null +++ b/tasks/e2e-old-node.sh @@ -0,0 +1,61 @@ +#!/bin/bash +# Copyright (c) 2015-present, Facebook, Inc. +# +# This source code is licensed under the MIT license found in the +# LICENSE file in the root directory of this source tree. + +# ****************************************************************************** +# This is an end-to-end test intended to run on CI. +# You can also run it locally but it's slow. +# ****************************************************************************** + +# Start in tasks/ even if run from root directory +cd "$(dirname "$0")" + +temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` + +function cleanup { + echo 'Cleaning up.' + cd "$root_path" + rm -rf $temp_app_path +} + +# Error messages are redirected to stderr +function handle_error { + echo "$(basename $0): ERROR! An error was encountered executing line $1." 1>&2; + cleanup + echo 'Exiting with error.' 1>&2; + exit 1 +} + +function handle_exit { + cleanup + echo 'Exiting without error.' 1>&2; + exit +} + +# Exit the script with a helpful error message when any error is encountered +trap 'set +x; handle_error $LINENO $BASH_COMMAND' ERR + +# Cleanup before exit on any termination signal +trap 'set +x; handle_exit' SIGQUIT SIGTERM SIGINT SIGKILL SIGHUP + +# Echo every command being executed +set -x + +# Go to root +cd .. +root_path=$PWD + +# We need to install create-react-app deps to test it +cd "$root_path"/packages/create-react-app +npm install +cd "$root_path" + +# If the node version is < 6, the script should just give an error. +cd $temp_app_path +err_output=`node "$root_path"/packages/create-react-app/index.js test-node-version 2>&1 > /dev/null || echo ''` +[[ $err_output =~ You\ are\ running\ Node ]] && exit 0 || exit 1 + +# Cleanup +cleanup diff --git a/tasks/e2e-simple.sh b/tasks/e2e-simple.sh index 9e51b00805d..b566ae37a3d 100755 --- a/tasks/e2e-simple.sh +++ b/tasks/e2e-simple.sh @@ -12,17 +12,21 @@ # Start in tasks/ even if run from root directory cd "$(dirname "$0")" -# CLI and app temporary locations +# App temporary location # http://unix.stackexchange.com/a/84980 -temp_cli_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_cli_path'` temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` +custom_registry_url=http://localhost:4873 +original_npm_registry_url=`npm get registry` +original_yarn_registry_url=`yarn config get registry` function cleanup { echo 'Cleaning up.' cd "$root_path" # Uncomment when snapshot testing is enabled by default: # rm ./packages/react-scripts/template/src/__snapshots__/App.test.js.snap - rm -rf "$temp_cli_path" $temp_app_path + rm -rf "$temp_app_path" + npm set registry "$original_npm_registry_url" + yarn config set registry "$original_yarn_registry_url" } # Error messages are redirected to stderr @@ -39,35 +43,6 @@ function handle_exit { exit } -function create_react_app { - node "$temp_cli_path"/node_modules/create-react-app/index.js "$@" -} - -function install_package { - local pkg=$(basename $1) - - # Clean target (for safety) - rm -rf node_modules/$pkg/ - rm -rf node_modules/**/$pkg/ - - # Copy package into node_modules/ ignoring installed deps - # rsync -a ${1%/} node_modules/ --exclude node_modules - cp -R ${1%/} node_modules/ - rm -rf node_modules/$pkg/node_modules/ - - # Install `dependencies` - cd node_modules/$pkg/ - if [ "$USE_YARN" = "yes" ] - then - yarn install --production - else - npm install --only=production - fi - # Remove our packages to ensure side-by-side versions are used (which we link) - rm -rf node_modules/{babel-preset-react-app,eslint-config-react-app,react-dev-utils,react-error-overlay,react-scripts} - cd ../.. -} - # Check for the existence of one or more files. function exists { for f in $*; do @@ -88,65 +63,40 @@ set -x cd .. root_path=$PWD -# Clear cache to avoid issues with incorrect packages being used -if hash yarnpkg 2>/dev/null -then - # AppVeyor uses an old version of yarn. - # Once updated to 0.24.3 or above, the workaround can be removed - # and replaced with `yarnpkg cache clean` - # Issues: - # https://github.com/yarnpkg/yarn/issues/2591 - # https://github.com/appveyor/ci/issues/1576 - # https://github.com/facebookincubator/create-react-app/pull/2400 - # When removing workaround, you may run into - # https://github.com/facebookincubator/create-react-app/issues/2030 - case "$(uname -s)" in - *CYGWIN*|MSYS*|MINGW*) yarn=yarn.cmd;; - *) yarn=yarnpkg;; - esac - $yarn cache clean +# Make sure we don't introduce accidental references to PATENTS. +EXPECTED='packages/react-error-overlay/fixtures/bundle.mjs +packages/react-error-overlay/fixtures/bundle.mjs.map +packages/react-error-overlay/fixtures/bundle_u.mjs +packages/react-error-overlay/fixtures/bundle_u.mjs.map +tasks/e2e-simple.sh' +ACTUAL=$(git grep -l PATENTS) +if [ "$EXPECTED" != "$ACTUAL" ]; then + echo "PATENTS crept into some new files?" + diff -u <(echo "$EXPECTED") <(echo "$ACTUAL") || true + exit 1 fi if hash npm 2>/dev/null then - # npm 5 is too buggy right now - if [ $(npm -v | head -c 1) -eq 5 ]; then - npm i -g npm@^4.x - fi; + npm i -g npm@latest npm cache clean || npm cache verify fi -# Prevent bootstrap, we only want top-level dependencies -cp package.json package.json.bak -grep -v "postinstall" package.json > temp && mv temp package.json -npm install -mv package.json.bak package.json - -# We need to install create-react-app deps to test it -cd "$root_path"/packages/create-react-app -npm install -cd "$root_path" - -# If the node version is < 6, the script should just give an error. -nodeVersion=`node --version | cut -d v -f2` -nodeMajor=`echo $nodeVersion | cut -d. -f1` -nodeMinor=`echo $nodeVersion | cut -d. -f2` -if [[ nodeMajor -lt 6 ]] -then - cd $temp_app_path - err_output=`node "$root_path"/packages/create-react-app/index.js test-node-version 2>&1 > /dev/null || echo ''` - [[ $err_output =~ You\ are\ running\ Node ]] && exit 0 || exit 1 -fi +# Bootstrap monorepo +yarn -if [ "$USE_YARN" = "yes" ] -then - # Install Yarn so that the test can use it to install packages. - npm install -g yarn - yarn cache clean -fi +# Start local registry +tmp_registry_log=`mktemp` +nohup npx verdaccio@2.7.2 &>$tmp_registry_log & +# Wait for `verdaccio` to boot +grep -q 'http address' <(tail -f $tmp_registry_log) -# We removed the postinstall, so do it manually here -node bootstrap.js +# Set registry to local registry +npm set registry "$custom_registry_url" +yarn config set registry "$custom_registry_url" + +# Login so we can publish packages +npx npm-cli-login@0.0.10 -u user -p password -e user@example.com -r "$custom_registry_url" --quotes # Lint own code ./node_modules/.bin/eslint --max-warnings 0 packages/babel-preset-react-app/ @@ -156,11 +106,16 @@ node bootstrap.js ./node_modules/.bin/eslint --max-warnings 0 packages/react-scripts/ cd packages/react-error-overlay/ ./node_modules/.bin/eslint --max-warnings 0 src/ -npm test -npm run build:prod +yarn test + +if [ $APPVEYOR != 'True' ]; then + # Flow started hanging on AppVeyor after we moved to Yarn Workspaces :-( + yarn flow +fi + cd ../.. cd packages/react-dev-utils/ -npm test +yarn test cd ../.. # ****************************************************************************** @@ -169,7 +124,7 @@ cd ../.. # ****************************************************************************** # Test local build command -npm run build +yarn build # Check for expected output exists build/*.html exists build/static/js/*.js @@ -178,55 +133,25 @@ exists build/static/media/*.svg exists build/favicon.ico # Run tests with CI flag -CI=true npm test +CI=true yarn test # Uncomment when snapshot testing is enabled by default: # exists template/src/__snapshots__/App.test.js.snap # Test local start command -npm start -- --smoke-test - -# ****************************************************************************** -# Next, pack react-scripts and create-react-app so we can verify they work. -# ****************************************************************************** - -# Pack CLI -cd "$root_path"/packages/create-react-app -cli_path=$PWD/`npm pack` - -# Go to react-scripts -cd "$root_path"/packages/react-scripts +yarn start --smoke-test -# Save package.json because we're going to touch it -cp package.json package.json.orig - -# Replace own dependencies (those in the `packages` dir) with the local paths -# of those packages. -node "$root_path"/tasks/replace-own-deps.js - -# Finally, pack react-scripts -scripts_path="$root_path"/packages/react-scripts/`npm pack` - -# Restore package.json -rm package.json -mv package.json.orig package.json +git clean -df +./tasks/publish.sh --yes --force-publish=* --skip-git --cd-version=prerelease --exact --npm-tag=latest # ****************************************************************************** -# Now that we have packed them, create a clean app folder and install them. +# Install react-scripts prerelease via create-react-app prerelease. # ****************************************************************************** -# Install the CLI in a temporary location -cd "$temp_cli_path" - -# Initialize package.json before installing the CLI because npm will not install -# the CLI properly in the temporary location if it is missing. -npm init --yes - -# Now we can install the CLI from the local package. -npm install "$cli_path" - # Install the app in a temporary location cd $temp_app_path -create_react_app --scripts-version="$scripts_path" test-app +npx create-react-app test-app + +# TODO: verify we installed prerelease # ****************************************************************************** # Now that we used create-react-app to create an app depending on react-scripts, @@ -243,24 +168,24 @@ function verify_env_url { # Test relative path build awk -v n=2 -v s=" \"homepage\": \".\"," 'NR == n {print s} {print}' package.json > tmp && mv tmp package.json - npm run build + yarn build # Disabled until this can be tested # grep -F -R --exclude=*.map "../../static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"./static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 - PUBLIC_URL="/anabsolute" npm run build + PUBLIC_URL="/anabsolute" yarn build grep -F -R --exclude=*.map "/anabsolute/static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 # Test absolute path build sed "2s/.*/ \"homepage\": \"\/testingpath\",/" package.json > tmp && mv tmp package.json - npm run build + yarn build grep -F -R --exclude=*.map "/testingpath/static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 - PUBLIC_URL="https://www.example.net/overridetest" npm run build + PUBLIC_URL="https://www.example.net/overridetest" yarn build grep -F -R --exclude=*.map "https://www.example.net/overridetest/static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 grep -F -R --exclude=*.map "testingpath/static" build/ -q; test $? -eq 1 || exit 1 @@ -268,11 +193,11 @@ function verify_env_url { # Test absolute url build sed "2s/.*/ \"homepage\": \"https:\/\/www.example.net\/testingpath\",/" package.json > tmp && mv tmp package.json - npm run build + yarn build grep -F -R --exclude=*.map "/testingpath/static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 - PUBLIC_URL="https://www.example.net/overridetest" npm run build + PUBLIC_URL="https://www.example.net/overridetest" yarn build grep -F -R --exclude=*.map "https://www.example.net/overridetest/static/" build/ -q; test $? -eq 0 || exit 1 grep -F -R --exclude=*.map "\"/static/" build/ -q; test $? -eq 1 || exit 1 grep -F -R --exclude=*.map "testingpath/static" build/ -q; test $? -eq 1 || exit 1 @@ -293,7 +218,7 @@ function verify_module_scope { echo "import sampleJson from '../sample'" | cat - src/App.js > src/App.js.temp && mv src/App.js.temp src/App.js # Make sure the build fails - npm run build; test $? -eq 1 || exit 1 + yarn build; test $? -eq 1 || exit 1 # TODO: check for error message # Restore App.js @@ -305,7 +230,7 @@ function verify_module_scope { cd test-app # Test the build -npm run build +yarn build # Check for expected output exists build/*.html exists build/static/js/*.js @@ -314,12 +239,12 @@ exists build/static/media/*.svg exists build/favicon.ico # Run tests with CI flag -CI=true npm test +CI=true yarn test # Uncomment when snapshot testing is enabled by default: # exists src/__snapshots__/App.test.js.snap # Test the server -npm start -- --smoke-test +yarn start --smoke-test # Test environment handling verify_env_url @@ -334,21 +259,8 @@ verify_module_scope # Eject... echo yes | npm run eject -# Ensure Yarn is ran after eject; at the time of this commit, we don't run Yarn -# after ejecting. Soon, we may only skip Yarn on Windows. Let's try to remove -# this in the near future. -if hash yarnpkg 2>/dev/null -then - yarnpkg install --check-files -fi - -# ...but still link to the local packages -install_package "$root_path"/packages/babel-preset-react-app -install_package "$root_path"/packages/eslint-config-react-app -install_package "$root_path"/packages/react-dev-utils - # Test the build -npm run build +yarn build # Check for expected output exists build/*.html exists build/static/js/*.js @@ -357,15 +269,15 @@ exists build/static/media/*.svg exists build/favicon.ico # Run tests, overring the watch option to disable it. -# `CI=true npm test` won't work here because `npm test` becomes just `jest`. +# `CI=true yarn test` won't work here because `yarn test` becomes just `jest`. # We should either teach Jest to respect CI env variable, or make # `scripts/test.js` survive ejection (right now it doesn't). -npm test -- --watch=no +yarn test --watch=no # Uncomment when snapshot testing is enabled by default: # exists src/__snapshots__/App.test.js.snap # Test the server -npm start -- --smoke-test +yarn start --smoke-test # Test environment handling verify_env_url diff --git a/tasks/local-test.sh b/tasks/local-test.sh index 8ce44b64057..0416fb5d9cc 100755 --- a/tasks/local-test.sh +++ b/tasks/local-test.sh @@ -11,7 +11,6 @@ function print_help { echo " --node-version the node version to use while testing [6]" echo " --git-branch the git branch to checkout for testing [the current one]" echo " --test-suite which test suite to use ('simple', installs', 'kitchensink', 'all') ['all']" - echo " --yarn if present, use yarn as the package manager" echo " --interactive gain a bash shell after the test run" echo " --help print this message and exit" echo "" @@ -22,7 +21,6 @@ cd $(dirname $0) node_version=6 current_git_branch=`git rev-parse --abbrev-ref HEAD` git_branch=${current_git_branch} -use_yarn=no test_suite=all interactive=false @@ -36,9 +34,6 @@ while [ "$1" != "" ]; do shift git_branch=$1 ;; - "--yarn") - use_yarn=yes - ;; "--test-suite") shift test_suite=$1 @@ -107,7 +102,6 @@ CMD docker run \ --env CI=true \ --env NPM_CONFIG_QUIET=true \ - --env USE_YARN=${use_yarn} \ --tty \ --user node \ --volume ${PWD}/..:/var/create-react-app \ diff --git a/tasks/release.sh b/tasks/publish.sh similarity index 84% rename from tasks/release.sh rename to tasks/publish.sh index 0f11bb0d60c..c1cae86c200 100755 --- a/tasks/release.sh +++ b/tasks/publish.sh @@ -26,21 +26,14 @@ set -x cd .. root_path=$PWD -# You can only release with npm >= 3 -if [ $(npm -v | head -c 1) -lt 3 ]; then - echo "Releasing requires npm >= 3. Aborting."; - exit 1; -fi; - if [ -n "$(git status --porcelain)" ]; then echo "Your git status is not clean. Aborting."; exit 1; fi -cd "$root_path" # Compile cd packages/react-error-overlay/ npm run build:prod cd ../.. # Go! -./node_modules/.bin/lerna publish --independent "$@" +./node_modules/.bin/lerna publish --independent "$@" \ No newline at end of file diff --git a/template/README.md b/template/README.md deleted file mode 100644 index 32efd00ff82..00000000000 --- a/template/README.md +++ /dev/null @@ -1,4 +0,0 @@ -This page has moved!
-Please update your link to point [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) instead. - -Sorry for the inconvenience!