├── packages ├── react-scripts │ ├── .npmignore │ ├── .babelrc │ ├── .eslintrc │ ├── fixtures │ │ └── kitchensink │ │ │ ├── .env │ │ │ ├── src │ │ │ ├── features │ │ │ │ ├── webpack │ │ │ │ │ ├── assets │ │ │ │ │ │ ├── aFileWithExt.unknown │ │ │ │ │ │ ├── aFileWithoutExt │ │ │ │ │ │ ├── abstract.json │ │ │ │ │ │ ├── style.css │ │ │ │ │ │ ├── tiniest-cat.jpg │ │ │ │ │ │ └── logo.svg │ │ │ │ │ ├── CssInclusion.js │ │ │ │ │ ├── SvgInclusion.js │ │ │ │ │ ├── JsonInclusion.js │ │ │ │ │ ├── ImageInclusion.js │ │ │ │ │ ├── NoExtInclusion.js │ │ │ │ │ ├── CssInclusion.test.js │ │ │ │ │ ├── SvgInclusion.test.js │ │ │ │ │ ├── JsonInclusion.test.js │ │ │ │ │ ├── ImageInclusion.test.js │ │ │ │ │ ├── NoExtInclusion.test.js │ │ │ │ │ ├── UnknownExtInclusion.js │ │ │ │ │ └── UnknownExtInclusion.test.js │ │ │ │ ├── env │ │ │ │ │ ├── PublicUrl.js │ │ │ │ │ ├── FileEnvVariables.js │ │ │ │ │ ├── ShellEnvVariables.js │ │ │ │ │ ├── PublicUrl.test.js │ │ │ │ │ ├── FileEnvVariables.test.js │ │ │ │ │ ├── ShellEnvVariables.test.js │ │ │ │ │ ├── NodePath.test.js │ │ │ │ │ └── NodePath.js │ │ │ │ └── syntax │ │ │ │ │ ├── Promises.test.js │ │ │ │ │ ├── AsyncAwait.test.js │ │ │ │ │ ├── Generators.test.js │ │ │ │ │ ├── ArraySpread.test.js │ │ │ │ │ ├── ObjectSpread.test.js │ │ │ │ │ ├── RestAndDefault.test.js │ │ │ │ │ ├── RestParameters.test.js │ │ │ │ │ ├── ClassProperties.test.js │ │ │ │ │ ├── DefaultParameters.test.js │ │ │ │ │ ├── ArrayDestructuring.test.js │ │ │ │ │ ├── ComputedProperties.test.js │ │ │ │ │ ├── CustomInterpolation.test.js │ │ │ │ │ ├── ObjectDestructuring.test.js │ │ │ │ │ ├── DestructuringAndAwait.test.js │ │ │ │ │ ├── TemplateInterpolation.test.js │ │ │ │ │ ├── ClassProperties.js │ │ │ │ │ ├── ArrayDestructuring.js │ │ │ │ │ ├── AsyncAwait.js │ │ │ │ │ ├── ArraySpread.js │ │ │ │ │ ├── Promises.js │ │ │ │ │ ├── Generators.js │ │ │ │ │ ├── DefaultParameters.js │ │ │ │ │ ├── DestructuringAndAwait.js │ │ │ │ │ ├── ObjectDestructuring.js │ │ │ │ │ ├── TemplateInterpolation.js │ │ │ │ │ ├── RestAndDefault.js │ │ │ │ │ ├── RestParameters.js │ │ │ │ │ ├── ComputedProperties.js │ │ │ │ │ ├── ObjectSpread.js │ │ │ │ │ └── CustomInterpolation.js │ │ │ ├── subfolder │ │ │ │ └── lol.js │ │ │ ├── absoluteLoad.js │ │ │ ├── index.js │ │ │ └── App.js │ │ │ ├── .flowconfig │ │ │ ├── .babelrc │ │ │ ├── public │ │ │ ├── favicon.ico │ │ │ └── index.html │ │ │ ├── gitignore │ │ │ ├── .template.dependencies.json │ │ │ └── integration │ │ │ ├── env.test.js │ │ │ ├── webpack.test.js │ │ │ ├── initDOM.js │ │ │ └── syntax.test.js │ ├── template │ │ ├── src │ │ │ ├── index.css │ │ │ ├── index.js │ │ │ ├── App.test.js │ │ │ ├── App.css │ │ │ ├── App.js │ │ │ └── logo.svg │ │ ├── public │ │ │ ├── favicon.ico │ │ │ └── index.html │ │ └── gitignore │ ├── config │ │ ├── jest │ │ │ ├── babelTransform.js │ │ │ ├── fileTransform.js │ │ │ └── cssTransform.js │ │ ├── polyfills.js │ │ ├── env.js │ │ └── paths.js │ ├── bin │ │ └── react-scripts.js │ ├── scripts │ │ ├── test.js │ │ ├── init.js │ │ ├── eject.js │ │ └── build.js │ ├── utils │ │ └── createJestConfig.js │ ├── package.json │ └── README.md ├── create-react-app │ ├── README.md │ └── package.json ├── react-dev-utils │ ├── clearConsole.js │ ├── package.json │ ├── checkRequiredFiles.js │ ├── WatchMissingNodeModulesPlugin.js │ ├── prompt.js │ ├── InterpolateHtmlPlugin.js │ ├── getProcessForPort.js │ ├── openBrowser.js │ ├── openChrome.applescript │ ├── formatWebpackMessages.js │ └── README.md ├── eslint-config-react-app │ ├── package.json │ ├── README.md │ └── index.js └── babel-preset-react-app │ ├── package.json │ ├── README.md │ └── index.js ├── .eslintrc ├── examples └── relay │ ├── .env │ ├── src │ ├── index.css │ ├── index.js │ ├── App.test.js │ ├── App.css │ ├── App.js │ └── logo.svg │ ├── public │ ├── favicon.ico │ └── index.html │ ├── libs │ ├── relay.js │ └── setupRelay.js │ ├── webpack.config.js │ ├── package.json │ └── README.md ├── .gitignore ├── template └── README.md ├── lerna.json ├── .travis.yml ├── package.json ├── tasks ├── replace-own-deps.js ├── release.sh ├── cra.sh ├── e2e-installs.sh ├── e2e-kitchensink.sh └── e2e-simple.sh ├── LICENSE ├── ISSUE_TEMPLATE.md ├── PATENTS ├── README.md └── CONTRIBUTING.md /packages/react-scripts/.npmignore: -------------------------------------------------------------------------------- 1 | /fixtures 2 | -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "react-app" 3 | } 4 | -------------------------------------------------------------------------------- /examples/relay/.env: -------------------------------------------------------------------------------- 1 | GRAPHQL_ENDPOINT=htp://localhost:4000/graphql -------------------------------------------------------------------------------- /packages/react-scripts/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"] 3 | } -------------------------------------------------------------------------------- /packages/react-scripts/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "react-app" 3 | } 4 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/.env: -------------------------------------------------------------------------------- 1 | REACT_APP_FILE_ENV_MESSAGE=fromtheenvfile 2 | -------------------------------------------------------------------------------- /examples/relay/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | font-family: sans-serif; 5 | } 6 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/aFileWithExt.unknown: -------------------------------------------------------------------------------- 1 | Whoooo, spooky! 2 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/subfolder/lol.js: -------------------------------------------------------------------------------- 1 | module.exports = function() { return `haha` } 2 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | padding: 0; 4 | font-family: sans-serif; 5 | } 6 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/aFileWithoutExt: -------------------------------------------------------------------------------- 1 | This is just a file without an extension 2 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/abstract.json: -------------------------------------------------------------------------------- 1 | { 2 | "abstract": "This is an abstract." 3 | } 4 | -------------------------------------------------------------------------------- /examples/relay/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/svrcekmichal/configurable-react-scripts/HEAD/examples/relay/public/favicon.ico -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | /node_modules/fbjs/.* 3 | 4 | [include] 5 | 6 | [libs] 7 | 8 | [options] 9 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"], 3 | "plugins": ["babel-plugin-transform-es2015-modules-commonjs"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/style.css: -------------------------------------------------------------------------------- 1 | #feature-css-inclusion { 2 | background: palevioletred; 3 | color: papayawhip; 4 | } 5 | -------------------------------------------------------------------------------- /packages/react-scripts/template/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/svrcekmichal/configurable-react-scripts/HEAD/packages/react-scripts/template/public/favicon.ico -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/svrcekmichal/configurable-react-scripts/HEAD/packages/react-scripts/fixtures/kitchensink/public/favicon.ico -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/absoluteLoad.js: -------------------------------------------------------------------------------- 1 | export default () => [ 2 | { id: 1, name: '1' }, 3 | { id: 2, name: '2' }, 4 | { id: 3, name: '3' }, 5 | { id: 4, name: '4' } 6 | ] 7 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/PublicUrl.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 | {process.env.PUBLIC_URL}. 5 | ) 6 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | build 3 | .DS_Store 4 | *.tgz 5 | my-app* 6 | template/src/__tests__/__snapshots__/ 7 | lerna-debug.log 8 | npm-debug.log* 9 | yarn-debug.log* 10 | yarn-error.log* 11 | /.changelog 12 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/FileEnvVariables.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 | {process.env.REACT_APP_FILE_ENV_MESSAGE}. 5 | ) 6 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/CssInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import './assets/style.css' 3 | 4 | export default () => ( 5 |

We love useless text.

6 | ) 7 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | ReactDOM.render( 6 | , 7 | document.getElementById('root') 8 | ); 9 | -------------------------------------------------------------------------------- /examples/relay/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | import './index.css'; 5 | 6 | ReactDOM.render( 7 | , 8 | document.getElementById('root') 9 | ); 10 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/ShellEnvVariables.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export default () => ( 4 | {process.env.REACT_APP_SHELL_ENV_MESSAGE}. 5 | ) 6 | -------------------------------------------------------------------------------- /template/README.md: -------------------------------------------------------------------------------- 1 | This page has moved! 2 | Please update your link to point [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) instead. 3 | 4 | Sorry for the inconvenience! 5 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/SvgInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import logo from './assets/logo.svg' 3 | 4 | export default () => ( 5 | logo 6 | ) 7 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/tiniest-cat.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/svrcekmichal/configurable-react-scripts/HEAD/packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/tiniest-cat.jpg -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/JsonInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { abstract } from './assets/abstract.json' 3 | 4 | export default () => ( 5 | {abstract} 6 | ) 7 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | import './index.css'; 5 | 6 | ReactDOM.render( 7 | , 8 | document.getElementById('root') 9 | ); 10 | -------------------------------------------------------------------------------- /examples/relay/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | }); 9 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/ImageInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import tiniestCat from './assets/tiniest-cat.jpg' 3 | 4 | export default () => ( 5 | tiniest cat 6 | ) 7 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | }); 9 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | node_modules 5 | 6 | # testing 7 | coverage 8 | 9 | # production 10 | build 11 | 12 | # misc 13 | .DS_Store 14 | .env 15 | npm-debug.log 16 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/.template.dependencies.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "babel-register": "6.22.0", 4 | "babel-plugin-transform-es2015-modules-commonjs": "6.22.0", 5 | "babel-polyfill": "6.20.0", 6 | "chai": "3.5.0", 7 | "jsdom": "9.8.3", 8 | "mocha": "3.2.0" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /packages/react-scripts/template/gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | 6 | # testing 7 | /coverage 8 | 9 | # production 10 | /build 11 | 12 | # misc 13 | .DS_Store 14 | .env 15 | npm-debug.log* 16 | yarn-debug.log* 17 | yarn-error.log* 18 | 19 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/PublicUrl.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import PublicUrl from './PublicUrl'; 4 | 5 | describe('PUBLIC_URL', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/NoExtInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import aFileWithoutExt from './assets/aFileWithoutExt' 3 | 4 | const text = aFileWithoutExt.includes('base64') 5 | ? atob(aFileWithoutExt.split('base64,')[1]).trim() 6 | : aFileWithoutExt 7 | 8 | export default () => ( 9 |

{text}.

10 | ) 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/CssInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import CssInclusion from './CssInclusion'; 4 | 5 | describe('css inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/SvgInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import SvgInclusion from './SvgInclusion'; 4 | 5 | describe('svg inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | React App 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/JsonInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import JsonInclusion from './JsonInclusion'; 4 | 5 | describe('JSON inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/ImageInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ImageInclusion from './ImageInclusion'; 4 | 5 | describe('image inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/NoExtInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import NoExtInclusion from './NoExtInclusion'; 4 | 5 | describe('no ext inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/FileEnvVariables.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import FileEnvVariables from './FileEnvVariables'; 4 | 5 | describe('.env variables', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/ShellEnvVariables.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ShellEnvVariables from './ShellEnvVariables'; 4 | 5 | describe('shell env variables', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/UnknownExtInclusion.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import aFileWithExtUnknown from './assets/aFileWithExt.unknown' 3 | 4 | const text = aFileWithExtUnknown.includes('base64') 5 | ? atob(aFileWithExtUnknown.split('base64,')[1]).trim() 6 | : aFileWithExtUnknown 7 | 8 | export default () => ( 9 |

{text}.

10 | ) 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/UnknownExtInclusion.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import UnknownExtInclusion from './UnknownExtInclusion'; 4 | 5 | describe('unknown ext inclusion', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | ReactDOM.render(, div); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/NodePath.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import NodePath from './NodePath'; 4 | 5 | describe('NODE_PATH', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/Promises.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import Promises from './Promises'; 4 | 5 | describe('promises', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/AsyncAwait.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import AsyncAwait from './AsyncAwait'; 4 | 5 | describe('async/await', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/Generators.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import Generators from './Generators'; 4 | 5 | describe('generators', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /examples/relay/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | animation: App-logo-spin infinite 20s linear; 7 | height: 80px; 8 | } 9 | 10 | .App-header { 11 | background-color: #222; 12 | height: 150px; 13 | padding: 20px; 14 | color: white; 15 | } 16 | 17 | .App-intro { 18 | font-size: large; 19 | } 20 | 21 | @keyframes App-logo-spin { 22 | from { transform: rotate(0deg); } 23 | to { transform: rotate(360deg); } 24 | } 25 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArraySpread.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ArraySpread from './ArraySpread'; 4 | 5 | describe('array spread', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectSpread.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ObjectSpread from './ObjectSpread'; 4 | 5 | describe('object spread', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/RestAndDefault.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import RestAndDefault from './RestAndDefault'; 4 | 5 | describe('rest + default', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/RestParameters.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import RestParameters from './RestParameters'; 4 | 5 | describe('rest parameters', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ClassProperties.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ClassProperties from './ClassProperties'; 4 | 5 | describe('class properties', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | text-align: center; 3 | } 4 | 5 | .App-logo { 6 | animation: App-logo-spin infinite 20s linear; 7 | height: 80px; 8 | } 9 | 10 | .App-header { 11 | background-color: #222; 12 | height: 150px; 13 | padding: 20px; 14 | color: white; 15 | } 16 | 17 | .App-intro { 18 | font-size: large; 19 | } 20 | 21 | @keyframes App-logo-spin { 22 | from { transform: rotate(0deg); } 23 | to { transform: rotate(360deg); } 24 | } 25 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/DefaultParameters.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import DefaultParameters from './DefaultParameters'; 4 | 5 | describe('default parameters', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArrayDestructuring.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ArrayDestructuring from './ArrayDestructuring'; 4 | 5 | describe('array destructuring', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ComputedProperties.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ComputedProperties from './ComputedProperties'; 4 | 5 | describe('computed properties', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/CustomInterpolation.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import CustomInterpolation from './CustomInterpolation'; 4 | 5 | describe('custom interpolation', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import ObjectDestructuring from './ObjectDestructuring'; 4 | 5 | describe('object destructuring', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/DestructuringAndAwait.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import DestructuringAndAwait from './DestructuringAndAwait'; 4 | 5 | describe('destructuring and await', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/TemplateInterpolation.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import TemplateInterpolation from './TemplateInterpolation'; 4 | 5 | describe('template interpolation', () => { 6 | it('renders without crashing', () => { 7 | const div = document.createElement('div'); 8 | return new Promise(resolve => { 9 | ReactDOM.render(, div); 10 | }); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /packages/create-react-app/README.md: -------------------------------------------------------------------------------- 1 | # create-react-app 2 | 3 | This package includes the global command for [Create React App](https://github.com/facebookincubator/create-react-app). 4 | Please refer to its documentation: 5 | 6 | * [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) – How to create a new app. 7 | * [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App. 8 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "lerna": "2.0.0-beta.37", 3 | "version": "independent", 4 | "changelog": { 5 | "repo": "facebookincubator/create-react-app", 6 | "labels": { 7 | "tag: new feature": ":rocket: New Feature", 8 | "tag: breaking change": ":boom: Breaking Change", 9 | "tag: bug fix": ":bug: Bug Fix", 10 | "tag: enhancement": ":nail_care: Enhancement", 11 | "tag: documentation": ":memo: Documentation", 12 | "tag: internal": ":house: Internal" 13 | }, 14 | "cacheDir": ".changelog" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /packages/react-dev-utils/clearConsole.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | function clearConsole() { 11 | process.stdout.write(process.platform === 'win32' ? '\x1Bc' : '\x1B[2J\x1B[3J\x1B[H'); 12 | } 13 | 14 | module.exports = clearConsole; 15 | -------------------------------------------------------------------------------- /packages/react-scripts/config/jest/babelTransform.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2014-present, Facebook, Inc. All rights reserved. 3 | * 4 | * This source code is licensed under the BSD-style license found in the 5 | * LICENSE file in the root directory of this source tree. An additional grant 6 | * of patent rights can be found in the PATENTS file in the same directory. 7 | */ 8 | 9 | const babelJest = require('babel-jest'); 10 | 11 | module.exports = babelJest.createTransformer({ 12 | presets: [require.resolve('babel-preset-react-app')], 13 | babelrc: false 14 | }); 15 | -------------------------------------------------------------------------------- /examples/relay/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import logo from './logo.svg'; 3 | import './App.css'; 4 | 5 | class App extends Component { 6 | render() { 7 | return ( 8 |
9 |
10 | logo 11 |

Welcome to Reactt

12 |
13 |

14 | To get started, edit src/App.js and save to reload. 15 |

16 |
17 | ); 18 | } 19 | } 20 | 21 | export default App; 22 | -------------------------------------------------------------------------------- /examples/relay/libs/relay.js: -------------------------------------------------------------------------------- 1 | var path = require('path'); 2 | var chalk = require('chalk'); 3 | var fs = require('fs') 4 | 5 | exports.schemaPath = path.resolve(__dirname, '../graphql-schema.json'); 6 | 7 | exports.getBabelRelayPlugin = function(){ 8 | if(!fs.existsSync(exports.schemaPath)) { 9 | console.log(chalk.red('GraphQL schema not found - have you run "npm run setupRelay"?')) 10 | process.exit("GraphQL schema not found"); 11 | } 12 | 13 | var schema = require(exports.schemaPath); 14 | var getBabelRelayPlugin = require('babel-relay-plugin'); 15 | return getBabelRelayPlugin(schema.data); 16 | } 17 | 18 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import logo from './logo.svg'; 3 | import './App.css'; 4 | 5 | class App extends Component { 6 | render() { 7 | return ( 8 |
9 |
10 | logo 11 |

Welcome to React

12 |
13 |

14 | To get started, edit src/App.js and save to reload. 15 |

16 |
17 | ); 18 | } 19 | } 20 | 21 | export default App; 22 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | --- 2 | language: node_js 3 | node_js: 4 | - 4 5 | - 6 6 | cache: 7 | directories: 8 | - node_modules 9 | - packages/create-react-app/node_modules 10 | - packages/react-scripts/node_modules 11 | script: 12 | - 'if [ $TEST_SUITE = "simple" ]; then tasks/e2e-simple.sh; fi' 13 | - 'if [ $TEST_SUITE = "installs" ]; then tasks/e2e-installs.sh; fi' 14 | - 'if [ $TEST_SUITE = "kitchensink" ]; then tasks/e2e-kitchensink.sh; fi' 15 | env: 16 | global: 17 | - USE_YARN=no 18 | matrix: 19 | - TEST_SUITE=simple 20 | - TEST_SUITE=installs 21 | - TEST_SUITE=kitchensink 22 | matrix: 23 | include: 24 | - node_js: 6 25 | env: USE_YARN=yes TEST_SUITE=simple 26 | -------------------------------------------------------------------------------- /packages/eslint-config-react-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "eslint-config-react-app", 4 | "version": "0.5.1", 5 | "description": "ESLint configuration used by Create React App", 6 | "repository": "facebookincubator/create-react-app", 7 | "license": "BSD-3-Clause", 8 | "bugs": { 9 | "url": "https://github.com/facebookincubator/create-react-app/issues" 10 | }, 11 | "files": [ 12 | "index.js" 13 | ], 14 | "peerDependencies": { 15 | "babel-eslint": "^7.0.0", 16 | "eslint": "^3.8.1", 17 | "eslint-plugin-flowtype": "^2.21.0", 18 | "eslint-plugin-import": "^2.0.1", 19 | "eslint-plugin-jsx-a11y": "^2.2.3", 20 | "eslint-plugin-react": "^6.4.1" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ClassProperties.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | export default class extends Component { 4 | static propTypes = { 5 | onReady: PropTypes.func.isRequired 6 | } 7 | 8 | users = [ 9 | { id: 1, name: '1' }, 10 | { id: 2, name: '2' }, 11 | { id: 3, name: '3' }, 12 | { id: 4, name: '4' } 13 | ]; 14 | 15 | componentDidMount() { 16 | this.props.onReady() 17 | } 18 | 19 | render() { 20 | return ( 21 |
22 | {this.users.map(user => ( 23 |
{user.name}
24 | ))} 25 |
26 | ); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /packages/react-scripts/config/jest/fileTransform.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2014-present, Facebook, Inc. All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | // @remove-on-eject-end 10 | 11 | const path = require('path'); 12 | 13 | // This is a custom Jest transformer turning file imports into filenames. 14 | // http://facebook.github.io/jest/docs/tutorial-webpack.html 15 | 16 | module.exports = { 17 | process(src, filename) { 18 | return 'module.exports = ' + JSON.stringify(path.basename(filename)) + ';'; 19 | }, 20 | }; 21 | -------------------------------------------------------------------------------- /packages/create-react-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "create-react-app", 4 | "version": "1.0.4", 5 | "keywords": [ 6 | "react" 7 | ], 8 | "description": "Create React apps with no build configuration.", 9 | "repository": "facebookincubator/create-react-app", 10 | "license": "BSD-3-Clause", 11 | "engines": { 12 | "node": ">=4" 13 | }, 14 | "bugs": { 15 | "url": "https://github.com/facebookincubator/create-react-app/issues" 16 | }, 17 | "files": [ 18 | "index.js" 19 | ], 20 | "bin": { 21 | "create-react-app": "./index.js" 22 | }, 23 | "dependencies": { 24 | "chalk": "^1.1.1", 25 | "commander": "^2.9.0", 26 | "cross-spawn": "^4.0.0", 27 | "fs-extra": "^1.0.0", 28 | "semver": "^5.0.3" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/env/NodePath.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | import load from 'absoluteLoad' 3 | 4 | export default class extends Component { 5 | static propTypes = { 6 | onReady: PropTypes.func.isRequired 7 | } 8 | 9 | constructor(props) { 10 | super(props); 11 | this.state = { users: [] }; 12 | } 13 | 14 | async componentDidMount() { 15 | const users = load(); 16 | this.setState({ users }); 17 | } 18 | 19 | componentDidUpdate() { 20 | this.props.onReady(); 21 | } 22 | 23 | render() { 24 | return ( 25 |
26 | {this.state.users.map(user => ( 27 |
{user.name}
28 | ))} 29 |
30 | ); 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /packages/react-scripts/config/jest/cssTransform.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2014-present, Facebook, Inc. All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | // @remove-on-eject-end 10 | 11 | // This is a custom Jest transformer turning style imports into empty objects. 12 | // http://facebook.github.io/jest/docs/tutorial-webpack.html 13 | 14 | module.exports = { 15 | process() { 16 | return 'module.exports = {};'; 17 | }, 18 | getCacheKey(fileData, filename) { 19 | // The output is always the same. 20 | return 'cssTransform'; 21 | }, 22 | }; 23 | -------------------------------------------------------------------------------- /examples/relay/webpack.config.js: -------------------------------------------------------------------------------- 1 | var relayLib = require('./libs/relay'); 2 | var fs = require('fs'); 3 | 4 | module.exports = function(webpackConfig, isDevelopment) { 5 | 6 | /** 7 | * Relay setup 8 | */ 9 | 10 | const babelRule = findRule(webpackConfig, function(rule){ return rule.loader === 'babel-loader' }); 11 | babelRule.options.plugins = babelRule.options.plugins || []; 12 | babelRule.options.plugins.push(relayLib.getBabelRelayPlugin()); 13 | babelRule.options.cacheDirectory = true; 14 | babelRule.options.cacheIdentifier = fs.statSync(relayLib.schemaPath).mtime; 15 | 16 | return webpackConfig; 17 | } 18 | 19 | function findRule(config, callback) { 20 | var index = config.module.rules.findIndex(callback); 21 | if(index === -1) throw Error('Rule now found'); 22 | return config.module.rules[index]; 23 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "scripts": { 4 | "build": "node packages/react-scripts/scripts/build.js", 5 | "changelog": "lerna-changelog", 6 | "create-react-app": "tasks/cra.sh", 7 | "e2e": "tasks/e2e-simple.sh", 8 | "postinstall": "lerna bootstrap", 9 | "publish": "tasks/release.sh", 10 | "start": "node packages/react-scripts/scripts/start.js", 11 | "test": "node packages/react-scripts/scripts/test.js --env=jsdom" 12 | }, 13 | "devDependencies": { 14 | "babel-eslint": "6.1.2", 15 | "eslint": "3.5.0", 16 | "eslint-config-react-app": "0.2.1", 17 | "eslint-plugin-flowtype": "2.18.1", 18 | "eslint-plugin-import": "1.12.0", 19 | "eslint-plugin-jsx-a11y": "2.2.2", 20 | "eslint-plugin-react": "6.3.0", 21 | "lerna": "^2.0.0-beta.37", 22 | "lerna-changelog": "^0.2.3" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /examples/relay/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "relay-example", 3 | "version": "0.1.0", 4 | "private": true, 5 | "devDependencies": { 6 | "@svrcekmichal/react-scripts": "^0.5.0-rc.0", 7 | "babel-relay-plugin": "^0.10.0", 8 | "chalk": "^1.1.3", 9 | "dotenv": "^4.0.0", 10 | "enzyme": "^2.7.1", 11 | "graphql": "^0.9.1", 12 | "node-fetch": "^1.6.3", 13 | "react-addons-test-utils": "^15.4.2" 14 | }, 15 | "dependencies": { 16 | "react": "^15.4.2", 17 | "react-dom": "^15.4.2", 18 | "react-relay": "^0.10.0", 19 | "react-router": "^3.0.2", 20 | "react-test-renderer": "^15.4.2", 21 | "relay-react-router": "^0.1.0" 22 | }, 23 | "scripts": { 24 | "setupRelay": "node libs/setupRelay.js", 25 | "start": "react-scripts start", 26 | "build": "react-scripts build", 27 | "test": "react-scripts test --env=jsdom", 28 | "eject": "react-scripts eject" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArrayDestructuring.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load() { 4 | return [ 5 | [1, '1'], 6 | [2, '2'], 7 | [3, '3'], 8 | [4, '4'] 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => { 35 | const [id, name] = user; 36 | return
{name}
37 | })} 38 |
39 | ); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/AsyncAwait.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | async function load() { 4 | return [ 5 | { id: 1, name: '1' }, 6 | { id: 2, name: '2' }, 7 | { id: 3, name: '3' }, 8 | { id: 4, name: '4' } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = await load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ArraySpread.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load(users) { 4 | return [ 5 | { id: 1, name: '1' }, 6 | { id: 2, name: '2' }, 7 | { id: 3, name: '3' }, 8 | ...users 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load([{ id: 42, name: '42' }]); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/Promises.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load() { 4 | return Promise.resolve([ 5 | { id: 1, name: '1' }, 6 | { id: 2, name: '2' }, 7 | { id: 3, name: '3' }, 8 | { id: 4, name: '4' } 9 | ]); 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | componentDidMount() { 23 | load().then(users => { 24 | this.setState({ users }); 25 | }); 26 | } 27 | 28 | componentDidUpdate() { 29 | this.props.onReady(); 30 | } 31 | 32 | render() { 33 | return ( 34 |
35 | {this.state.users.map(user => ( 36 |
{user.name}
37 | ))} 38 |
39 | ); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/Generators.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function * load(limit) { 4 | let i = 1; 5 | while (i <= limit) { 6 | yield { id: i, name: i }; 7 | i++; 8 | } 9 | } 10 | 11 | export default class extends Component { 12 | static propTypes = { 13 | onReady: PropTypes.func.isRequired 14 | } 15 | 16 | constructor(props) { 17 | super(props); 18 | this.state = { users: [] }; 19 | } 20 | 21 | componentDidMount() { 22 | const users = []; 23 | for (let user of load(4)) { 24 | users.push(user); 25 | } 26 | this.setState({ users }); 27 | } 28 | 29 | componentDidUpdate() { 30 | this.props.onReady(); 31 | } 32 | 33 | render() { 34 | return ( 35 |
36 | {this.state.users.map(user => ( 37 |
{user.name}
38 | ))} 39 |
40 | ); 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/DefaultParameters.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load(id = 0) { 4 | return [ 5 | { id: id + 1, name: '1' }, 6 | { id: id + 2, name: '2' }, 7 | { id: id + 3, name: '3' }, 8 | { id: id + 4, name: '4' } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/DestructuringAndAwait.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | async function load() { 4 | return { users: [ 5 | { id: 1, name: '1' }, 6 | { id: 2, name: '2' }, 7 | { id: 3, name: '3' }, 8 | { id: 4, name: '4' } 9 | ] }; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const { users } = await load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectDestructuring.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load() { 4 | return [ 5 | { id: 1, name: '1' }, 6 | { id: 2, name: '2' }, 7 | { id: 3, name: '3' }, 8 | { id: 4, name: '4' } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => { 35 | const { id, name } = user; 36 | return
{name}
37 | })} 38 |
39 | ); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/TemplateInterpolation.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load(name) { 4 | return [ 5 | { id: 1, name: `${name}1` }, 6 | { id: 2, name: `${name}2` }, 7 | { id: 3, name: `${name}3` }, 8 | { id: 4, name: `${name}4` } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load('user_'); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/RestAndDefault.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load({ id, ...rest } = { id: 0, user: { id: 42, name: '42' } }) { 4 | return [ 5 | { id: id + 1, name: '1' }, 6 | { id: id + 2, name: '2' }, 7 | { id: id + 3, name: '3' }, 8 | rest.user 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load(); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/RestParameters.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load({ id = 0, ...rest }) { 4 | return [ 5 | { id: id + 1, name: '1' }, 6 | { id: id + 2, name: '2' }, 7 | { id: id + 3, name: '3' }, 8 | rest.user 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load({ id: 0, user: { id: 42, name: '42' } }); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-dev-utils/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "react-dev-utils", 4 | "version": "0.5.0", 5 | "description": "Webpack utilities used by Create React App", 6 | "repository": "facebookincubator/create-react-app", 7 | "license": "BSD-3-Clause", 8 | "bugs": { 9 | "url": "https://github.com/facebookincubator/create-react-app/issues" 10 | }, 11 | "engines": { 12 | "node": ">=4" 13 | }, 14 | "files": [ 15 | "clearConsole.js", 16 | "checkRequiredFiles.js", 17 | "formatWebpackMessages.js", 18 | "getProcessForPort.js", 19 | "InterpolateHtmlPlugin.js", 20 | "openChrome.applescript", 21 | "openBrowser.js", 22 | "prompt.js", 23 | "WatchMissingNodeModulesPlugin.js", 24 | "webpackHotDevClient.js" 25 | ], 26 | "dependencies": { 27 | "ansi-html": "0.0.5", 28 | "chalk": "1.1.3", 29 | "escape-string-regexp": "1.0.5", 30 | "html-entities": "1.2.0", 31 | "opn": "4.0.2", 32 | "sockjs-client": "1.0.1", 33 | "strip-ansi": "3.0.1" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ComputedProperties.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load(prefix) { 4 | return [ 5 | { id: 1, [prefix + 'name']: '1' }, 6 | { id: 2, [prefix + 'name']: '2' }, 7 | { id: 3, [prefix + 'name']: '3' }, 8 | { id: 4, [prefix + 'name']: '4' } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load('user_'); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.user_name}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/ObjectSpread.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | function load(baseUser) { 4 | return [ 5 | { id: 1, name: '1', ...baseUser }, 6 | { id: 2, name: '2', ...baseUser }, 7 | { id: 3, name: '3', ...baseUser }, 8 | { id: 4, name: '4', ...baseUser } 9 | ]; 10 | } 11 | 12 | export default class extends Component { 13 | static propTypes = { 14 | onReady: PropTypes.func.isRequired 15 | } 16 | 17 | constructor(props) { 18 | super(props); 19 | this.state = { users: [] }; 20 | } 21 | 22 | async componentDidMount() { 23 | const users = load({ age: 42 }); 24 | this.setState({ users }); 25 | } 26 | 27 | componentDidUpdate() { 28 | this.props.onReady(); 29 | } 30 | 31 | render() { 32 | return ( 33 |
34 | {this.state.users.map(user => ( 35 |
{user.name}: {user.age}
36 | ))} 37 |
38 | ); 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /tasks/replace-own-deps.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * All rights reserved. 5 | * 6 | * This source code is licensed under the BSD-style license found in the 7 | * LICENSE file in the root directory of this source tree. An additional grant 8 | * of patent rights can be found in the PATENTS file in the same directory. 9 | */ 10 | 'use strict'; 11 | 12 | // Replaces internal dependencies in package.json with local package paths. 13 | 14 | const fs = require('fs'); 15 | const path = require('path'); 16 | 17 | const packagesDir = path.join(__dirname, '../packages'); 18 | const pkgFilename = path.join(packagesDir, 'react-scripts/package.json'); 19 | const data = require(pkgFilename); 20 | 21 | fs.readdirSync(packagesDir).forEach((name) => { 22 | if (data.dependencies[name]) { 23 | data.dependencies[name] = 'file:' + path.join(packagesDir, name); 24 | } 25 | }) 26 | 27 | fs.writeFile(pkgFilename, JSON.stringify(data, null, 2), 'utf8', (err) => { 28 | if (err) throw err; 29 | console.log('Replaced local dependencies.'); 30 | }); 31 | -------------------------------------------------------------------------------- /packages/react-scripts/config/polyfills.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * All rights reserved. 5 | * 6 | * This source code is licensed under the BSD-style license found in the 7 | * LICENSE file in the root directory of this source tree. An additional grant 8 | * of patent rights can be found in the PATENTS file in the same directory. 9 | */ 10 | // @remove-on-eject-end 11 | 12 | if (typeof Promise === 'undefined') { 13 | // Rejection tracking prevents a common issue where React gets into an 14 | // inconsistent state due to an error, but it gets swallowed by a Promise, 15 | // and the user has no idea what causes React's erratic future behavior. 16 | require('promise/lib/rejection-tracking').enable(); 17 | window.Promise = require('promise/lib/es6-extensions.js'); 18 | } 19 | 20 | // fetch() polyfill for making API calls. 21 | require('whatwg-fetch'); 22 | 23 | // Object.assign() is commonly used with React. 24 | // It will use the native implementation if it's present and isn't buggy. 25 | Object.assign = require('object-assign'); 26 | -------------------------------------------------------------------------------- /packages/react-dev-utils/checkRequiredFiles.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | var fs = require('fs'); 11 | var path = require('path'); 12 | var chalk = require('chalk'); 13 | 14 | function checkRequiredFiles(files) { 15 | var currentFilePath; 16 | try { 17 | files.forEach(filePath => { 18 | currentFilePath = filePath; 19 | fs.accessSync(filePath, fs.F_OK); 20 | }); 21 | return true; 22 | } catch (err) { 23 | var dirName = path.dirname(currentFilePath); 24 | var fileName = path.basename(currentFilePath); 25 | console.log(chalk.red('Could not find a required file.')); 26 | console.log(chalk.red(' Name: ') + chalk.cyan(fileName)); 27 | console.log(chalk.red(' Searched in: ') + chalk.cyan(dirName)); 28 | return false; 29 | } 30 | } 31 | 32 | module.exports = checkRequiredFiles; 33 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "babel-preset-react-app", 4 | "version": "2.1.0", 5 | "description": "Babel preset used by Create React App", 6 | "repository": "facebookincubator/create-react-app", 7 | "license": "BSD-3-Clause", 8 | "bugs": { 9 | "url": "https://github.com/facebookincubator/create-react-app/issues" 10 | }, 11 | "files": [ 12 | "index.js" 13 | ], 14 | "dependencies": { 15 | "babel-plugin-transform-class-properties": "6.22.0", 16 | "babel-plugin-transform-es2015-parameters": "6.22.0", 17 | "babel-plugin-transform-object-rest-spread": "6.22.0", 18 | "babel-plugin-transform-react-constant-elements": "6.22.0", 19 | "babel-plugin-transform-react-jsx": "6.22.0", 20 | "babel-plugin-transform-react-jsx-self": "6.22.0", 21 | "babel-plugin-transform-react-jsx-source": "6.22.0", 22 | "babel-plugin-transform-regenerator": "6.22.0", 23 | "babel-plugin-transform-runtime": "6.22.0", 24 | "babel-preset-env": "1.1.8", 25 | "babel-preset-latest": "6.22.0", 26 | "babel-preset-react": "6.22.0", 27 | "babel-runtime": "6.22.0" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /examples/relay/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 16 | React App 17 | 18 | 19 |
20 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /packages/react-scripts/template/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 16 | React App 17 | 18 | 19 |
20 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/syntax/CustomInterpolation.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes } from 'react' 2 | 3 | const styled = ([style]) => style.trim() 4 | .split(/\s*;\s*/) 5 | .map(rule => rule.split(/\s*:\s*/)) 6 | .reduce((rules, rule) => ({ ...rules, [rule[0]]: rule[1] }), {}); 7 | 8 | function load() { 9 | return [ 10 | { id: 1, name: '1' }, 11 | { id: 2, name: '2' }, 12 | { id: 3, name: '3' }, 13 | { id: 4, name: '4' } 14 | ]; 15 | } 16 | 17 | export default class extends Component { 18 | static propTypes = { 19 | onReady: PropTypes.func.isRequired 20 | } 21 | 22 | constructor(props) { 23 | super(props); 24 | this.state = { users: [] }; 25 | } 26 | 27 | async componentDidMount() { 28 | const users = load(); 29 | this.setState({ users }); 30 | } 31 | 32 | componentDidUpdate() { 33 | this.props.onReady(); 34 | } 35 | 36 | render() { 37 | const veryInlineStyle = styled` 38 | background: palevioletred; 39 | color: papayawhip; 40 | `; 41 | 42 | return ( 43 |
44 | {this.state.users.map(user => ( 45 |
{user.name}
46 | ))} 47 |
48 | ); 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/integration/env.test.js: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import initDOM from './initDOM' 3 | 4 | describe('Integration', () => { 5 | describe('Environment variables', () => { 6 | it('file env variables', async () => { 7 | const doc = await initDOM('file-env-variables') 8 | 9 | expect(doc.getElementById('feature-file-env-variables').textContent).to.equal('fromtheenvfile.') 10 | }) 11 | 12 | it('NODE_PATH', async () => { 13 | const doc = await initDOM('node-path') 14 | 15 | expect(doc.getElementById('feature-node-path').childElementCount).to.equal(4) 16 | }) 17 | 18 | it('PUBLIC_URL', async () => { 19 | const doc = await initDOM('public-url') 20 | 21 | const prefix = process.env.NODE_ENV === 'development' ? '' : 'http://www.example.org/spa'; 22 | expect(doc.getElementById('feature-public-url').textContent).to.equal(`${prefix}.`) 23 | expect(doc.querySelector('head link[rel="shortcut icon"]').getAttribute('href')) 24 | .to.equal(`${prefix}/favicon.ico`) 25 | }) 26 | 27 | it('shell env variables', async () => { 28 | const doc = await initDOM('shell-env-variables') 29 | 30 | expect(doc.getElementById('feature-shell-env-variables').textContent).to.equal('fromtheshell.') 31 | }) 32 | }) 33 | }) 34 | -------------------------------------------------------------------------------- /packages/react-scripts/bin/react-scripts.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | var spawn = require('cross-spawn'); 3 | var script = process.argv[2]; 4 | var args = process.argv.slice(3); 5 | 6 | switch (script) { 7 | case 'build': 8 | case 'eject': 9 | case 'start': 10 | case 'test': 11 | var result = spawn.sync( 12 | 'node', 13 | [require.resolve('../scripts/' + script)].concat(args), 14 | {stdio: 'inherit'} 15 | ); 16 | if (result.signal) { 17 | if (result.signal == 'SIGKILL') { 18 | console.log( 19 | 'The build failed because the process exited too early. ' + 20 | 'This probably means the system ran out of memory or someone called ' + 21 | '`kill -9` on the process.' 22 | ); 23 | } else if (result.signal == 'SIGTERM') { 24 | console.log( 25 | 'The build failed because the process exited too early. ' + 26 | 'Someone might have called `kill` or `killall`, or the system could ' + 27 | 'be shutting down.' 28 | ); 29 | } 30 | process.exit(1); 31 | } 32 | process.exit(result.status); 33 | break; 34 | default: 35 | console.log('Unknown script "' + script + '".'); 36 | console.log('Perhaps you need to update react-scripts?'); 37 | console.log('See: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#updating-to-new-releases'); 38 | break; 39 | } 40 | -------------------------------------------------------------------------------- /packages/react-dev-utils/WatchMissingNodeModulesPlugin.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | // This Webpack plugin ensures `npm install ` forces a project rebuild. 11 | // We’re not sure why this isn't Webpack's default behavior. 12 | // See https://github.com/facebookincubator/create-react-app/issues/186. 13 | 14 | 'use strict'; 15 | 16 | class WatchMissingNodeModulesPlugin { 17 | constructor(nodeModulesPath) { 18 | this.nodeModulesPath = nodeModulesPath; 19 | } 20 | 21 | apply(compiler) { 22 | compiler.plugin('emit', (compilation, callback) => { 23 | var missingDeps = compilation.missingDependencies; 24 | var nodeModulesPath = this.nodeModulesPath; 25 | 26 | // If any missing files are expected to appear in node_modules... 27 | if (missingDeps.some(file => file.indexOf(nodeModulesPath) !== -1)) { 28 | // ...tell webpack to watch node_modules recursively until they appear. 29 | compilation.contextDependencies.push(nodeModulesPath); 30 | } 31 | 32 | callback(); 33 | }); 34 | } 35 | } 36 | 37 | module.exports = WatchMissingNodeModulesPlugin; 38 | -------------------------------------------------------------------------------- /packages/react-dev-utils/prompt.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | var rl = require('readline'); 11 | 12 | // Convention: "no" should be the conservative choice. 13 | // If you mistype the answer, we'll always take it as a "no". 14 | // You can control the behavior on with `isYesDefault`. 15 | function prompt(question, isYesDefault) { 16 | if (typeof isYesDefault !== 'boolean') { 17 | throw new Error('Provide explicit boolean isYesDefault as second argument.'); 18 | } 19 | return new Promise(resolve => { 20 | var rlInterface = rl.createInterface({ 21 | input: process.stdin, 22 | output: process.stdout, 23 | }); 24 | 25 | var hint = isYesDefault === true ? '[Y/n]' : '[y/N]'; 26 | var message = question + ' ' + hint + '\n'; 27 | 28 | rlInterface.question(message, function(answer) { 29 | rlInterface.close(); 30 | 31 | var useDefault = answer.trim().length === 0; 32 | if (useDefault) { 33 | return resolve(isYesDefault); 34 | } 35 | 36 | var isYes = answer.match(/^(yes|y)$/i); 37 | return resolve(isYes); 38 | }); 39 | }); 40 | }; 41 | 42 | module.exports = prompt; 43 | -------------------------------------------------------------------------------- /packages/react-scripts/scripts/test.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * All rights reserved. 5 | * 6 | * This source code is licensed under the BSD-style license found in the 7 | * LICENSE file in the root directory of this source tree. An additional grant 8 | * of patent rights can be found in the PATENTS file in the same directory. 9 | */ 10 | // @remove-on-eject-end 11 | 12 | process.env.NODE_ENV = 'test'; 13 | process.env.PUBLIC_URL = ''; 14 | 15 | // Load environment variables from .env file. Suppress warnings using silent 16 | // if this file is missing. dotenv will never modify any environment variables 17 | // that have already been set. 18 | // https://github.com/motdotla/dotenv 19 | require('dotenv').config({silent: true}); 20 | 21 | const jest = require('jest'); 22 | const argv = process.argv.slice(2); 23 | 24 | // Watch unless on CI or in coverage mode 25 | if (!process.env.CI && argv.indexOf('--coverage') < 0) { 26 | argv.push('--watch'); 27 | } 28 | 29 | // @remove-on-eject-begin 30 | // This is not necessary after eject because we embed config into package.json. 31 | const createJestConfig = require('../utils/createJestConfig'); 32 | const path = require('path'); 33 | const paths = require('../config/paths'); 34 | argv.push('--config', JSON.stringify(createJestConfig( 35 | relativePath => path.resolve(__dirname, '..', relativePath), 36 | path.resolve(paths.appSrc, '..'), 37 | false 38 | ))); 39 | // @remove-on-eject-end 40 | jest.run(argv); 41 | -------------------------------------------------------------------------------- /packages/babel-preset-react-app/README.md: -------------------------------------------------------------------------------- 1 | # babel-preset-react-app 2 | 3 | This package includes the Babel preset used by [Create React App](https://github.com/facebookincubator/create-react-app). 4 | Please refer to its documentation: 5 | 6 | * [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) – How to create a new app. 7 | * [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App. 8 | 9 | ## Usage in Create React App Projects 10 | 11 | The easiest way to use this configuration is with [Create React App](https://github.com/facebookincubator/create-react-app), which includes it by default. **You don’t need to install it separately in Create React App projects.** 12 | 13 | ## Usage Outside of Create React App 14 | 15 | If you want to use this Babel preset in a project not built with Create React App, you can install it with following steps. 16 | 17 | First, [install Babel](https://babeljs.io/docs/setup/). 18 | 19 | Then create a file named `.babelrc` with following contents in the root folder of your project: 20 | 21 | ```js 22 | { 23 | "presets": ["react-app"] 24 | } 25 | ``` 26 | 27 | This preset uses the `useBuiltIns` option with [transform-object-rest-spread](http://babeljs.io/docs/plugins/transform-object-rest-spread/) and [transform-react-jsx](http://babeljs.io/docs/plugins/transform-react-jsx/), which assumes that `Object.assign` is available or polyfilled. 28 | -------------------------------------------------------------------------------- /tasks/release.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | # Copyright (c) 2015-present, Facebook, Inc. 3 | # All rights reserved. 4 | # 5 | # This source code is licensed under the BSD-style license found in the 6 | # LICENSE file in the root directory of this source tree. An additional grant 7 | # of patent rights can be found in the PATENTS file in the same directory. 8 | 9 | # ****************************************************************************** 10 | # This releases an update to the `react-scripts` package. 11 | # Don't use `npm publish` for it. 12 | # Read the release instructions: 13 | # https://github.com/facebookincubator/create-react-app/blob/master/CONTRIBUTING.md#cutting-a-release 14 | # ****************************************************************************** 15 | 16 | # Start in tasks/ even if run from root directory 17 | cd "$(dirname "$0")" 18 | 19 | # Exit the script on any command with non 0 return code 20 | # We assume that all the commands in the pipeline set their return code 21 | # properly and that we do not need to validate that the output is correct 22 | set -e 23 | 24 | # Echo every command being executed 25 | set -x 26 | 27 | # Go to root 28 | cd .. 29 | root_path=$PWD 30 | 31 | # You can only release with npm >= 3 32 | if [ $(npm -v | head -c 1) -lt 3 ]; then 33 | echo "Releasing requires npm >= 3. Aborting."; 34 | exit 1; 35 | fi; 36 | 37 | if [ -n "$(git status --porcelain)" ]; then 38 | echo "Your git status is not clean. Aborting."; 39 | exit 1; 40 | fi 41 | 42 | cd $root_path 43 | # Go! 44 | ./node_modules/.bin/lerna publish --independent "$@" 45 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | BSD License 2 | 3 | For create-react-app software 4 | 5 | Copyright (c) 2016-present, Facebook, Inc. All rights reserved. 6 | 7 | Redistribution and use in source and binary forms, with or without modification, 8 | are permitted provided that the following conditions are met: 9 | 10 | * Redistributions of source code must retain the above copyright notice, this 11 | list of conditions and the following disclaimer. 12 | 13 | * Redistributions in binary form must reproduce the above copyright notice, 14 | this list of conditions and the following disclaimer in the documentation 15 | and/or other materials provided with the distribution. 16 | 17 | * Neither the name Facebook nor the names of its contributors may be used to 18 | endorse or promote products derived from this software without specific 19 | prior written permission. 20 | 21 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND 22 | ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 23 | WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 24 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR 25 | ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 26 | (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 27 | LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON 28 | ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 29 | (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS 30 | SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 31 | -------------------------------------------------------------------------------- /packages/react-dev-utils/InterpolateHtmlPlugin.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | // This Webpack plugin lets us interpolate custom variables into `index.html`. 11 | // Usage: `new InterpolateHtmlPlugin({ 'MY_VARIABLE': 42 })` 12 | // Then, you can use %MY_VARIABLE% in your `index.html`. 13 | 14 | // It works in tandem with HtmlWebpackPlugin. 15 | // Learn more about creating plugins like this: 16 | // https://github.com/ampedandwired/html-webpack-plugin#events 17 | 18 | 'use strict'; 19 | const escapeStringRegexp = require('escape-string-regexp'); 20 | 21 | class InterpolateHtmlPlugin { 22 | constructor(replacements) { 23 | this.replacements = replacements; 24 | } 25 | 26 | apply(compiler) { 27 | compiler.plugin('compilation', compilation => { 28 | compilation.plugin('html-webpack-plugin-before-html-processing', 29 | (data, callback) => { 30 | // Run HTML through a series of user-specified string replacements. 31 | Object.keys(this.replacements).forEach(key => { 32 | const value = this.replacements[key]; 33 | data.html = data.html.replace( 34 | new RegExp('%' + escapeStringRegexp(key) + '%', 'g'), 35 | value 36 | ); 37 | }); 38 | callback(null, data); 39 | } 40 | ); 41 | }); 42 | } 43 | } 44 | 45 | module.exports = InterpolateHtmlPlugin; 46 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/integration/webpack.test.js: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import initDOM from './initDOM' 3 | 4 | describe('Integration', () => { 5 | describe('Webpack plugins', () => { 6 | it('css inclusion', async () => { 7 | const doc = await initDOM('css-inclusion') 8 | 9 | expect(doc.getElementsByTagName('style')[0].textContent.replace(/\s/g, '')) 10 | .to.match(/#feature-css-inclusion\{background:.+;color:.+}/) 11 | }) 12 | 13 | it('image inclusion', async () => { 14 | const doc = await initDOM('image-inclusion') 15 | 16 | expect(doc.getElementById('feature-image-inclusion').src).to.match(/^data:image\/jpeg;base64.+==$/) 17 | }) 18 | 19 | it('no ext inclusion', async () => { 20 | const doc = await initDOM('no-ext-inclusion') 21 | 22 | expect(doc.getElementById('feature-no-ext-inclusion').textContent) 23 | .to.equal('This is just a file without an extension.') 24 | }) 25 | 26 | it('json inclusion', async () => { 27 | const doc = await initDOM('json-inclusion') 28 | 29 | expect(doc.getElementById('feature-json-inclusion').textContent).to.equal('This is an abstract.') 30 | }) 31 | 32 | it('svg inclusion', async () => { 33 | const doc = await initDOM('svg-inclusion') 34 | 35 | expect(doc.getElementById('feature-svg-inclusion').src).to.match(/\/static\/media\/logo\..+\.svg$/) 36 | }) 37 | 38 | it('unknown ext inclusion', async () => { 39 | const doc = await initDOM('unknown-ext-inclusion') 40 | 41 | expect(doc.getElementById('feature-unknown-ext-inclusion').textContent).to.equal('Whoooo, spooky!.') 42 | }) 43 | }) 44 | }) 45 | -------------------------------------------------------------------------------- /ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely. 2 | 3 | ### Can you reproduce the problem with latest npm? 4 | 5 | Many errors, especially related to "missing modules", are due to npm bugs. 6 | 7 | If you're using Windows, [follow these instructions to update npm](https://github.com/npm/npm/wiki/Troubleshooting#upgrading-on-windows). 8 | 9 | If you're using OS X or Linux, run this to update npm: 10 | 11 | ``` 12 | npm install -g npm@latest 13 | 14 | cd your_project_directory 15 | rm -rf node_modules 16 | npm install 17 | ``` 18 | 19 | Then try to reproduce the issue again. 20 | 21 | Can you still reproduce it? 22 | 23 | ### Description 24 | 25 | What are you reporting? 26 | 27 | ### Expected behavior 28 | 29 | Tell us what you think should happen. 30 | 31 | ### Actual behavior 32 | 33 | Tell us what actually happens. 34 | 35 | ### Environment 36 | 37 | Run these commands in the project folder and fill in their results: 38 | 39 | 1. `npm ls react-scripts` (if you haven’t ejected): 40 | 2. `node -v`: 41 | 3. `npm -v`: 42 | 43 | Then, specify: 44 | 45 | 1. Operating system: 46 | 2. Browser and version: 47 | 48 | ### Reproducible Demo 49 | 50 | Please take the time to create a new app that reproduces the issue. 51 | 52 | Alternatively, you could copy your app that experiences the problem and start removing things until you’re left with the minimal reproducible demo. 53 | 54 | (Accidentally, you might get to the root of your problem during that process.) 55 | 56 | Push to GitHub and paste the link here. 57 | 58 | By doing this, you're helping the Create React App contributors a big time! 59 | Demonstrable issues gets fixed faster. 60 | -------------------------------------------------------------------------------- /packages/eslint-config-react-app/README.md: -------------------------------------------------------------------------------- 1 | # eslint-config-react-app 2 | 3 | This package includes the shareable ESLint configuration used by [Create React App](https://github.com/facebookincubator/create-react-app). 4 | Please refer to its documentation: 5 | 6 | * [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) – How to create a new app. 7 | * [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App. 8 | 9 | ## Usage in Create React App Projects 10 | 11 | The easiest way to use this configuration is with [Create React App](https://github.com/facebookincubator/create-react-app), which includes it by default. **You don’t need to install it separately in Create React App projects.** 12 | 13 | ## Usage Outside of Create React App 14 | 15 | If you want to use this ESLint configuration in a project not built with Create React App, you can install it with following steps. 16 | 17 | First, install this package, ESLint and the necessary plugins. 18 | 19 | ```sh 20 | npm install --save-dev eslint-config-react-app babel-eslint@7.0.0 eslint@3.8.1 eslint-plugin-flowtype@2.21.0 eslint-plugin-import@2.0.1 eslint-plugin-jsx-a11y@2.2.3 eslint-plugin-react@6.4.1 21 | ``` 22 | 23 | Then create a file named `.eslintrc` with following contents in the root folder of your project: 24 | 25 | ```js 26 | { 27 | "extends": "react-app" 28 | } 29 | ``` 30 | 31 | That's it! You can override the settings from `eslint-config-react-app` by editing the `.eslintrc` file. Learn more about [configuring ESLint](http://eslint.org/docs/user-guide/configuring) on the ESLint website. 32 | -------------------------------------------------------------------------------- /packages/react-scripts/config/env.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * All rights reserved. 5 | * 6 | * This source code is licensed under the BSD-style license found in the 7 | * LICENSE file in the root directory of this source tree. An additional grant 8 | * of patent rights can be found in the PATENTS file in the same directory. 9 | */ 10 | // @remove-on-eject-end 11 | 12 | // Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be 13 | // injected into the application via DefinePlugin in Webpack configuration. 14 | 15 | var REACT_APP = /^REACT_APP_/i; 16 | 17 | function getClientEnvironment(publicUrl) { 18 | var raw = Object 19 | .keys(process.env) 20 | .filter(key => REACT_APP.test(key)) 21 | .reduce((env, key) => { 22 | env[key] = process.env[key]; 23 | return env; 24 | }, { 25 | // Useful for determining whether we’re running in production mode. 26 | // Most importantly, it switches React into the correct mode. 27 | 'NODE_ENV': process.env.NODE_ENV || 'development', 28 | // Useful for resolving the correct path to static assets in `public`. 29 | // For example, . 30 | // This should only be used as an escape hatch. Normally you would put 31 | // images into the `src` and `import` them in code to get their paths. 32 | 'PUBLIC_URL': publicUrl 33 | }); 34 | // Stringify all values so we can feed into Webpack DefinePlugin 35 | var stringified = { 36 | 'process.env': Object 37 | .keys(raw) 38 | .reduce((env, key) => { 39 | env[key] = JSON.stringify(raw[key]); 40 | return env; 41 | }, {}) 42 | }; 43 | 44 | return { raw, stringified }; 45 | } 46 | 47 | module.exports = getClientEnvironment; 48 | -------------------------------------------------------------------------------- /packages/react-dev-utils/getProcessForPort.js: -------------------------------------------------------------------------------- 1 | var chalk = require('chalk'); 2 | var execSync = require('child_process').execSync; 3 | var path = require('path'); 4 | 5 | var execOptions = { 6 | encoding: 'utf8', 7 | stdio: [ 8 | 'pipe', // stdin (default) 9 | 'pipe', // stdout (default) 10 | 'ignore' //stderr 11 | ] 12 | }; 13 | 14 | function isProcessAReactApp(processCommand) { 15 | return /^node .*react-scripts\/scripts\/start\.js\s?$/.test(processCommand); 16 | } 17 | 18 | function getProcessIdOnPort(port) { 19 | return execSync('lsof -i:' + port + ' -P -t -sTCP:LISTEN', execOptions).trim(); 20 | } 21 | 22 | function getPackageNameInDirectory(directory) { 23 | var packagePath = path.join(directory.trim(), 'package.json'); 24 | 25 | try { 26 | return require(packagePath).name; 27 | } catch(e) { 28 | return null; 29 | } 30 | 31 | } 32 | 33 | function getProcessCommand(processId, processDirectory) { 34 | var command = execSync('ps -o command -p ' + processId + ' | sed -n 2p', execOptions); 35 | 36 | if (isProcessAReactApp(command)) { 37 | const packageName = getPackageNameInDirectory(processDirectory); 38 | return (packageName) ? packageName + '\n' : command; 39 | } else { 40 | return command; 41 | } 42 | 43 | } 44 | 45 | function getDirectoryOfProcessById(processId) { 46 | return execSync('lsof -p '+ processId + ' | grep cwd | awk \'{print $9}\'', execOptions).trim(); 47 | } 48 | 49 | function getProcessForPort(port) { 50 | try { 51 | var processId = getProcessIdOnPort(port); 52 | var directory = getDirectoryOfProcessById(processId); 53 | var command = getProcessCommand(processId, directory); 54 | return chalk.cyan(command) + chalk.blue(' in ') + chalk.cyan(directory); 55 | } catch(e) { 56 | return null; 57 | } 58 | } 59 | 60 | module.exports = getProcessForPort; 61 | 62 | -------------------------------------------------------------------------------- /packages/react-scripts/utils/createJestConfig.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | // Note: this file does not exist after ejecting. 11 | 12 | const fs = require('fs'); 13 | const paths = require('../config/paths'); 14 | 15 | module.exports = (resolve, rootDir, isEjecting) => { 16 | // Use this instead of `paths.testsSetup` to avoid putting 17 | // an absolute filename into configuration after ejecting. 18 | const setupTestsFile = fs.existsSync(paths.testsSetup) ? '/src/setupTests.js' : undefined; 19 | 20 | // TODO: I don't know if it's safe or not to just use / as path separator 21 | // in Jest configs. We need help from somebody with Windows to determine this. 22 | const config = { 23 | collectCoverageFrom: ['src/**/*.{js,jsx}'], 24 | setupFiles: [resolve('config/polyfills.js')], 25 | setupTestFrameworkScriptFile: setupTestsFile, 26 | testPathIgnorePatterns: [ 27 | '[/\\\\](build|docs|node_modules|scripts)[/\\\\]' 28 | ], 29 | testEnvironment: 'node', 30 | testURL: 'http://localhost', 31 | transform: { 32 | '^.+\\.(js|jsx)$': isEjecting ? 33 | '/node_modules/babel-jest' 34 | : resolve('config/jest/babelTransform.js'), 35 | '^.+\\.css$': resolve('config/jest/cssTransform.js'), 36 | '^(?!.*\\.(js|jsx|css|json)$)': resolve('config/jest/fileTransform.js'), 37 | }, 38 | transformIgnorePatterns: [ 39 | '[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$' 40 | ], 41 | moduleNameMapper: { 42 | '^react-native$': 'react-native-web' 43 | } 44 | }; 45 | if (rootDir) { 46 | config.rootDir = rootDir; 47 | } 48 | return config; 49 | }; 50 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/integration/initDOM.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const http = require('http') 3 | const jsdom = require('jsdom') 4 | const path = require('path') 5 | const { expect } = require('chai') 6 | 7 | let getMarkup 8 | let resourceLoader 9 | 10 | if (process.env.E2E_FILE) { 11 | const file = path.isAbsolute(process.env.E2E_FILE) 12 | ? process.env.E2E_FILE 13 | : path.join(process.cwd(), process.env.E2E_FILE) 14 | 15 | const markup = fs.readFileSync(file, 'utf8') 16 | getMarkup = () => markup 17 | 18 | const pathPrefix = process.env.PUBLIC_URL.replace(/^https?:\/\/[^\/]+\/?/, '') 19 | 20 | resourceLoader = (resource, callback) => callback( 21 | null, 22 | fs.readFileSync(path.join(path.dirname(file), resource.url.pathname.replace(pathPrefix, '')), 'utf8') 23 | ) 24 | } else if (process.env.E2E_URL) { 25 | getMarkup = () => new Promise(resolve => { 26 | http.get(process.env.E2E_URL, (res) => { 27 | let rawData = '' 28 | res.on('data', chunk => rawData += chunk) 29 | res.on('end', () => resolve(rawData)) 30 | }) 31 | }) 32 | 33 | resourceLoader = (resource, callback) => resource.defaultFetch(callback) 34 | } else { 35 | it.only('can run jsdom (at least one of "E2E_FILE" or "E2E_URL" environment variables must be provided)', () => { 36 | expect(new Error('This isn\'t the error you are looking for.')).to.be.undefined() 37 | }) 38 | } 39 | 40 | export default feature => new Promise(async resolve => { 41 | const markup = await getMarkup() 42 | const host = process.env.E2E_URL || 'http://www.example.org/spa:3000' 43 | const doc = jsdom.jsdom(markup, { 44 | features: { 45 | FetchExternalResources: ['script', 'css'], 46 | ProcessExternalResources: ['script'], 47 | }, 48 | created: (_, win) => win.addEventListener('ReactFeatureDidMount', () => resolve(doc), true), 49 | deferClose: true, 50 | resourceLoader, 51 | url: `${host}#${feature}`, 52 | virtualConsole: jsdom.createVirtualConsole().sendTo(console), 53 | }) 54 | 55 | doc.close() 56 | }) 57 | -------------------------------------------------------------------------------- /PATENTS: -------------------------------------------------------------------------------- 1 | Additional Grant of Patent Rights Version 2 2 | 3 | "Software" means the create-react-app software distributed by Facebook, Inc. 4 | 5 | Facebook, Inc. ("Facebook") hereby grants to each recipient of the Software 6 | ("you") a perpetual, worldwide, royalty-free, non-exclusive, irrevocable 7 | (subject to the termination provision below) license under any Necessary 8 | Claims, to make, have made, use, sell, offer to sell, import, and otherwise 9 | transfer the Software. For avoidance of doubt, no license is granted under 10 | Facebook’s rights in any patent claims that are infringed by (i) modifications 11 | to the Software made by you or any third party or (ii) the Software in 12 | combination with any software or other technology. 13 | 14 | The license granted hereunder will terminate, automatically and without notice, 15 | if you (or any of your subsidiaries, corporate affiliates or agents) initiate 16 | directly or indirectly, or take a direct financial interest in, any Patent 17 | Assertion: (i) against Facebook or any of its subsidiaries or corporate 18 | affiliates, (ii) against any party if such Patent Assertion arises in whole or 19 | in part from any software, technology, product or service of Facebook or any of 20 | its subsidiaries or corporate affiliates, or (iii) against any party relating 21 | to the Software. Notwithstanding the foregoing, if Facebook or any of its 22 | subsidiaries or corporate affiliates files a lawsuit alleging patent 23 | infringement against you in the first instance, and you respond by filing a 24 | patent infringement counterclaim in that lawsuit against that party that is 25 | unrelated to the Software, the license granted hereunder will not terminate 26 | under section (i) of this paragraph due to such counterclaim. 27 | 28 | A "Necessary Claim" is a claim of a patent owned by Facebook that is 29 | necessarily infringed by the Software standing alone. 30 | 31 | A "Patent Assertion" is any lawsuit or other action alleging direct, indirect, 32 | or contributory infringement or inducement to infringe any patent, including a 33 | cross-claim or counterclaim. 34 | -------------------------------------------------------------------------------- /packages/react-dev-utils/openBrowser.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | var execSync = require('child_process').execSync; 11 | var opn = require('opn'); 12 | 13 | // https://github.com/sindresorhus/opn#app 14 | var OSX_CHROME = 'google chrome'; 15 | 16 | function openBrowser(url) { 17 | // Attempt to honor this environment variable. 18 | // It is specific to the operating system. 19 | // See https://github.com/sindresorhus/opn#app for documentation. 20 | const browser = process.env.BROWSER; 21 | 22 | // Special case: BROWSER="none" will prevent opening completely. 23 | if (browser === 'none') { 24 | return false; 25 | } 26 | 27 | // If we're on OS X, the user hasn't specifically 28 | // requested a different browser, we can try opening 29 | // Chrome with AppleScript. This lets us reuse an 30 | // existing tab when possible instead of creating a new one. 31 | const shouldTryOpenChromeWithAppleScript = ( 32 | process.platform === 'darwin' && ( 33 | typeof browser !== 'string' || 34 | browser === OSX_CHROME 35 | ) 36 | ); 37 | 38 | if (shouldTryOpenChromeWithAppleScript) { 39 | try { 40 | // Try our best to reuse existing tab 41 | // on OS X Google Chrome with AppleScript 42 | execSync('ps cax | grep "Google Chrome"'); 43 | execSync( 44 | 'osascript openChrome.applescript ' + url, 45 | {cwd: __dirname, stdio: 'ignore'} 46 | ); 47 | return true; 48 | } catch (err) { 49 | // Ignore errors. 50 | } 51 | } 52 | 53 | // Fallback to opn 54 | // (It will always open new tab) 55 | try { 56 | var options = {app: browser}; 57 | opn(url, options).catch(() => {}); // Prevent `unhandledRejection` error. 58 | return true; 59 | } catch (err) { 60 | return false; 61 | } 62 | } 63 | 64 | module.exports = openBrowser; 65 | -------------------------------------------------------------------------------- /packages/react-scripts/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "configurable-react-scripts", 3 | "version": "0.1.1", 4 | "description": "Configuration and scripts for Create React App.", 5 | "repository": "facebookincubator/create-react-app", 6 | "license": "BSD-3-Clause", 7 | "engines": { 8 | "node": ">=4" 9 | }, 10 | "bugs": { 11 | "url": "https://github.com/facebookincubator/create-react-app/issues" 12 | }, 13 | "files": [ 14 | ".babelrc", 15 | ".eslintrc", 16 | "bin", 17 | "config", 18 | "scripts", 19 | "template", 20 | "utils" 21 | ], 22 | "bin": { 23 | "react-scripts": "./bin/react-scripts.js" 24 | }, 25 | "dependencies": { 26 | "autoprefixer": "6.7.2", 27 | "babel-core": "6.22.1", 28 | "babel-eslint": "7.1.1", 29 | "babel-jest": "18.0.0", 30 | "babel-loader": "6.2.10", 31 | "babel-preset-react-app": "^2.1.0", 32 | "babel-runtime": "^6.20.0", 33 | "case-sensitive-paths-webpack-plugin": "1.1.4", 34 | "chalk": "1.1.3", 35 | "connect-history-api-fallback": "1.3.0", 36 | "cross-spawn": "4.0.2", 37 | "css-loader": "0.26.1", 38 | "detect-port": "1.0.1", 39 | "dotenv": "2.0.0", 40 | "eslint": "3.8.1", 41 | "eslint-config-react-app": "^0.5.1", 42 | "eslint-loader": "1.6.1", 43 | "eslint-plugin-flowtype": "2.21.0", 44 | "eslint-plugin-import": "2.0.1", 45 | "eslint-plugin-jsx-a11y": "2.2.3", 46 | "eslint-plugin-react": "6.4.1", 47 | "extract-text-webpack-plugin": "2.0.0-rc.3", 48 | "file-loader": "0.10.0", 49 | "filesize": "3.3.0", 50 | "fs-extra": "0.30.0", 51 | "gzip-size": "3.0.0", 52 | "html-webpack-plugin": "2.28.0", 53 | "http-proxy-middleware": "0.17.3", 54 | "jest": "18.1.0", 55 | "object-assign": "4.1.1", 56 | "postcss-loader": "1.2.2", 57 | "promise": "7.1.1", 58 | "react-dev-utils": "^0.5.0", 59 | "recursive-readdir": "2.1.0", 60 | "strip-ansi": "3.0.1", 61 | "style-loader": "0.13.1", 62 | "url-loader": "0.5.7", 63 | "webpack": "2.2.1", 64 | "webpack-dev-server": "2.3.0", 65 | "webpack-manifest-plugin": "1.1.0", 66 | "whatwg-fetch": "2.0.2" 67 | }, 68 | "devDependencies": { 69 | "react": "^15.3.0", 70 | "react-dom": "^15.3.0" 71 | }, 72 | "optionalDependencies": { 73 | "fsevents": "1.0.17" 74 | } 75 | } 76 | -------------------------------------------------------------------------------- /examples/relay/src/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /packages/react-scripts/template/src/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/features/webpack/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /packages/react-dev-utils/openChrome.applescript: -------------------------------------------------------------------------------- 1 | (* 2 | Copyright (c) 2015-present, Facebook, Inc. 3 | All rights reserved. 4 | 5 | This source code is licensed under the BSD-style license found in the 6 | -- LICENSE file in the root directory of this source tree. An additional grant 7 | of patent rights can be found in the PATENTS file in the same directory. 8 | *) 9 | 10 | property targetTab: null 11 | property targetTabIndex: -1 12 | property targetWindow: null 13 | 14 | on run argv 15 | set theURL to item 1 of argv 16 | 17 | tell application "Chrome" 18 | 19 | if (count every window) = 0 then 20 | make new window 21 | end if 22 | 23 | -- 1: Looking for tab running debugger 24 | -- then, Reload debugging tab if found 25 | -- then return 26 | set found to my lookupTabWithUrl(theURL) 27 | if found then 28 | set targetWindow's active tab index to targetTabIndex 29 | tell targetTab to reload 30 | tell targetWindow to activate 31 | set index of targetWindow to 1 32 | return 33 | end if 34 | 35 | -- 2: Looking for Empty tab 36 | -- In case debugging tab was not found 37 | -- We try to find an empty tab instead 38 | set found to my lookupTabWithUrl("chrome://newtab/") 39 | if found then 40 | set targetWindow's active tab index to targetTabIndex 41 | set URL of targetTab to theURL 42 | tell targetWindow to activate 43 | return 44 | end if 45 | 46 | -- 3: Create new tab 47 | -- both debugging and empty tab were not found 48 | -- make a new tab with url 49 | tell window 1 50 | activate 51 | make new tab with properties {URL:theURL} 52 | end tell 53 | end tell 54 | end run 55 | 56 | -- Function: 57 | -- Lookup tab with given url 58 | -- if found, store tab, index, and window in properties 59 | -- (properties were declared on top of file) 60 | on lookupTabWithUrl(lookupUrl) 61 | tell application "Chrome" 62 | -- Find a tab with the given url 63 | set found to false 64 | set theTabIndex to -1 65 | repeat with theWindow in every window 66 | set theTabIndex to 0 67 | repeat with theTab in every tab of theWindow 68 | set theTabIndex to theTabIndex + 1 69 | if (theTab's URL as string) contains lookupUrl then 70 | -- assign tab, tab index, and window to properties 71 | set targetTab to theTab 72 | set targetTabIndex to theTabIndex 73 | set targetWindow to theWindow 74 | set found to true 75 | exit repeat 76 | end if 77 | end repeat 78 | 79 | if found then 80 | exit repeat 81 | end if 82 | end repeat 83 | end tell 84 | return found 85 | end lookupTabWithUrl 86 | -------------------------------------------------------------------------------- /tasks/cra.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | # Copyright (c) 2015-present, Facebook, Inc. 3 | # All rights reserved. 4 | # 5 | # This source code is licensed under the BSD-style license found in the 6 | # LICENSE file in the root directory of this source tree. An additional grant 7 | # of patent rights can be found in the PATENTS file in the same directory. 8 | 9 | # ****************************************************************************** 10 | # This creates an app with the global CLI and `react-scripts` from the source. 11 | # It is useful for testing the end-to-end flow locally. 12 | # ****************************************************************************** 13 | 14 | # Start in tasks/ even if run from root directory 15 | cd "$(dirname "$0")" 16 | 17 | function cleanup { 18 | echo 'Cleaning up.' 19 | # Uncomment when snapshot testing is enabled by default: 20 | # rm ./template/src/__snapshots__/App.test.js.snap 21 | } 22 | 23 | # Error messages are redirected to stderr 24 | function handle_error { 25 | echo "$(basename $0): ERROR! An error was encountered executing line $1." 1>&2; 26 | cleanup 27 | echo 'Exiting with error.' 1>&2; 28 | exit 1 29 | } 30 | 31 | function handle_exit { 32 | cleanup 33 | echo 'Exiting without error.' 1>&2; 34 | exit 35 | } 36 | 37 | # Exit the script with a helpful error message when any error is encountered 38 | trap 'set +x; handle_error $LINENO $BASH_COMMAND' ERR 39 | 40 | # Cleanup before exit on any termination signal 41 | trap 'set +x; handle_exit' SIGQUIT SIGTERM SIGINT SIGKILL SIGHUP 42 | 43 | # Echo every command being executed 44 | set -x 45 | 46 | # Go to root 47 | cd .. 48 | root_path=$PWD 49 | 50 | # ****************************************************************************** 51 | # Pack react-scripts so we can verify they work. 52 | # ****************************************************************************** 53 | 54 | # Install all our packages 55 | $root_path/node_modules/.bin/lerna bootstrap 56 | 57 | cd packages/react-scripts 58 | 59 | # Save package.json because we're going to touch it 60 | cp package.json package.json.orig 61 | 62 | # Replace own dependencies (those in the `packages` dir) with the local paths 63 | # of those packages. 64 | node $root_path/tasks/replace-own-deps.js 65 | 66 | # Finally, pack react-scripts 67 | scripts_path=$root_path/packages/react-scripts/`npm pack` 68 | 69 | # Restore package.json 70 | rm package.json 71 | mv package.json.orig package.json 72 | 73 | 74 | # ****************************************************************************** 75 | # Now that we have packed them, call the global CLI. 76 | # ****************************************************************************** 77 | 78 | # If Yarn is installed, clean its cache because it may have cached react-scripts 79 | yarn cache clean || true 80 | 81 | # Go back to the root directory and run the command from here 82 | cd $root_path 83 | node packages/create-react-app/index.js --scripts-version=$scripts_path "$@" 84 | 85 | # Cleanup 86 | cleanup 87 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Configurable react-scripts 2 | Latest version of original react-scripts: 0.9.0 3 | 4 | ## ⚠️ Warning 5 | 6 | This is **not** a fork of [```create-react-app```](https://github.com/facebookincubator/create-react-app). It's just a fork of ```react-scripts``` with possible modification of webpack config. 7 | 8 | ## Why I've built this? 9 | 10 | Create-react-app is great. It is so great I've migrated most of my apps from different boilerplates. But I've always find something I missed. 11 | 12 | In first app, I've needed support of CSS-modules, so I've created my custom react-scripts with scope `@svrcekmichal/react-scripts`. Everything was great for a while, until I've needed to add LESS, so I published new version. In second app I've been using Relay, so I've added Relay to my package. As you can see, it started growing, but I've added it and pretend everything is fine. In third app I wanted to test styled-components and I wanted to add custom babel plugin fore better react-devtools. 13 | 14 | That's the point where everything in me broken. I've started to search for better alternatives and opened npms.io. I found 164+ packages with or withous scope which handled most of the time same stuff. LESS, SASS, CSS-modules, css variables etc. This is all stuff which can be added with few lines of code to webpack config. 15 | 16 | And here I am, and you are here too. Probably with the same problem. 17 | 18 | ## ☢ DANGER ☢ 19 | 20 | There is multiple reasons why not to do it this way! This solution was proposed multiple times before, so I link few PRs where is everything better explained. 21 | 22 | [#99](https://github.com/facebookincubator/create-react-app/issues/99) 23 | [#145](https://github.com/facebookincubator/create-react-app/issues/145) 24 | [#460](https://github.com/facebookincubator/create-react-app/issues/460) 25 | [#481](https://github.com/facebookincubator/create-react-app/issues/481) 26 | [#1060](https://github.com/facebookincubator/create-react-app/issues/1060) 27 | [#1103](https://github.com/facebookincubator/create-react-app/issues/1103) 28 | [#1111](https://github.com/facebookincubator/create-react-app/issues/1111) 29 | 30 | As [@gaearon](https://github.com/gaearon) mentioned multiple times there, it's not good idea to extend it. From my point of view, I'm giving you gun, so try not to shot yourself, because probably nobody will help you. When you modify something, be completely sure what you doing! 31 | 32 | ## Instalation 33 | 34 | ``` 35 | create-react-app my-app --scripts-version configurable-react-scripts 36 | ``` 37 | 38 | ## Usage 39 | 40 | To modify webpack config create `webpack.config.js` file in your project directory. Add following body and modify whatever you want inside function body. 41 | First argument is original config from `react-scripts`, second is for target only dev or only prod features. Don't forget to return modified config! 42 | 43 | ```js 44 | module.exports = function(webpackConfig, isDevelopment) { 45 | 46 | //here you can modify webpack config 47 | 48 | return webpackConfig; 49 | } 50 | ``` 51 | 52 | ## Examples 53 | 54 | I've added example with Relay. It can be seen in `examples` folder. If you can, I will accept any PR with features like LESS, SASS, CSS-modules etc. 55 | 56 | -------------------------------------------------------------------------------- /examples/relay/README.md: -------------------------------------------------------------------------------- 1 | # Configurable react-scripts 2 | Latest version of original react-scripts: 0.9.0 3 | 4 | ## ⚠️ Warning 5 | 6 | This is **not** a fork of [```create-react-app```](https://github.com/facebookincubator/create-react-app). It's just a fork of ```react-scripts``` with possible modification of webpack config. 7 | 8 | ## Why I've built this? 9 | 10 | Create-react-app is great. It is so great I've migrated most of my apps from different boilerplates. But I've always find something I missed. 11 | 12 | In first app, I've needed support of CSS-modules, so I've created my custom react-scripts with scope `@svrcekmichal/react-scripts`. Everything was great for a while, until I've needed to add LESS, so I published new version. In second app I've been using Relay, so I've added Relay to my package. As you can see, it started growing, but I've added it and pretend everything is fine. In third app I wanted to test styled-components and I wanted to add custom babel plugin fore better react-devtools. 13 | 14 | That's the point where everything in me broken. I've started to search for better alternatives and opened npms.io. I found 164+ packages with or withous scope which handled most of the time same stuff. LESS, SASS, CSS-modules, css variables etc. This is all stuff which can be added with few lines of code to webpack config. 15 | 16 | And here I am, and you are here too. Probably with the same problem. 17 | 18 | ## ☢ DANGER ☢ 19 | 20 | There is multiple reasons why not to do it this way! This solution was proposed multiple times before, so I link few PRs where is everything better explained. 21 | 22 | [#99](https://github.com/facebookincubator/create-react-app/issues/99) 23 | [#145](https://github.com/facebookincubator/create-react-app/issues/145) 24 | [#460](https://github.com/facebookincubator/create-react-app/issues/460) 25 | [#481](https://github.com/facebookincubator/create-react-app/issues/481) 26 | [#1060](https://github.com/facebookincubator/create-react-app/issues/1060) 27 | [#1103](https://github.com/facebookincubator/create-react-app/issues/1103) 28 | [#1111](https://github.com/facebookincubator/create-react-app/issues/1111) 29 | 30 | As [@gaearon](https://github.com/gaearon) mentioned multiple times there, it's not good idea to extend it. From my point of view, I'm giving you gun, so try not to shot yourself, because probably nobody will help you. When you modify something, be completely sure what you doing! 31 | 32 | ## Instalation 33 | 34 | ``` 35 | create-react-app my-app --scripts-version configurable-react-scripts 36 | ``` 37 | 38 | ## Usage 39 | 40 | To modify webpack config create `webpack.config.js` file in your project directory. Add following body and modify whatever you want inside function body. 41 | First argument is original config from `react-scripts`, second is for target only dev or only prod features. Don't forget to return modified config! 42 | 43 | ```js 44 | module.exports = function(webpackConfig, isDevelopment) { 45 | 46 | //here you can modify webpack config 47 | 48 | return webpackConfig; 49 | } 50 | ``` 51 | 52 | ## Examples 53 | 54 | I've added example with Relay. It can be seen in `examples` folder. If you can, I will accept any PR with features like LESS, SASS, CSS-modules etc. 55 | 56 | -------------------------------------------------------------------------------- /packages/react-scripts/README.md: -------------------------------------------------------------------------------- 1 | # Configurable react-scripts 2 | Latest version of original react-scripts: 0.9.0 3 | 4 | ## ⚠️ Warning 5 | 6 | This is **not** a fork of [```create-react-app```](https://github.com/facebookincubator/create-react-app). It's just a fork of ```react-scripts``` with possible modification of webpack config. 7 | 8 | ## Why I've built this? 9 | 10 | Create-react-app is great. It is so great I've migrated most of my apps from different boilerplates. But I've always find something I missed. 11 | 12 | In first app, I've needed support of CSS-modules, so I've created my custom react-scripts with scope `@svrcekmichal/react-scripts`. Everything was great for a while, until I've needed to add LESS, so I published new version. In second app I've been using Relay, so I've added Relay to my package. As you can see, it started growing, but I've added it and pretend everything is fine. In third app I wanted to test styled-components and I wanted to add custom babel plugin fore better react-devtools. 13 | 14 | That's the point where everything in me broken. I've started to search for better alternatives and opened npms.io. I found 164+ packages with or withous scope which handled most of the time same stuff. LESS, SASS, CSS-modules, css variables etc. This is all stuff which can be added with few lines of code to webpack config. 15 | 16 | And here I am, and you are here too. Probably with the same problem. 17 | 18 | ## ☢ DANGER ☢ 19 | 20 | There is multiple reasons why not to do it this way! This solution was proposed multiple times before, so I link few PRs where is everything better explained. 21 | 22 | [#99](https://github.com/facebookincubator/create-react-app/issues/99) 23 | [#145](https://github.com/facebookincubator/create-react-app/issues/145) 24 | [#460](https://github.com/facebookincubator/create-react-app/issues/460) 25 | [#481](https://github.com/facebookincubator/create-react-app/issues/481) 26 | [#1060](https://github.com/facebookincubator/create-react-app/issues/1060) 27 | [#1103](https://github.com/facebookincubator/create-react-app/issues/1103) 28 | [#1111](https://github.com/facebookincubator/create-react-app/issues/1111) 29 | 30 | As [@gaearon](https://github.com/gaearon) mentioned multiple times there, it's not good idea to extend it. From my point of view, I'm giving you gun, so try not to shot yourself, because probably nobody will help you. When you modify something, be completely sure what you doing! 31 | 32 | ## Instalation 33 | 34 | ``` 35 | create-react-app my-app --scripts-version configurable-react-scripts 36 | ``` 37 | 38 | ## Usage 39 | 40 | To modify webpack config create `webpack.config.js` file in your project directory. Add following body and modify whatever you want inside function body. 41 | First argument is original config from `react-scripts`, second is for target only dev or only prod features. Don't forget to return modified config! 42 | 43 | ```js 44 | module.exports = function(webpackConfig, isDevelopment) { 45 | 46 | //here you can modify webpack config 47 | 48 | return webpackConfig; 49 | } 50 | ``` 51 | 52 | ## Examples 53 | 54 | I've added example with Relay. It can be seen in `examples` folder. If you can, I will accept any PR with features like LESS, SASS, CSS-modules etc. 55 | 56 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/integration/syntax.test.js: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import initDOM from './initDOM' 3 | 4 | describe('Integration', () => { 5 | describe('Language syntax', () => { 6 | it('array destructuring', async () => { 7 | const doc = await initDOM('array-destructuring') 8 | 9 | expect(doc.getElementById('feature-array-destructuring').childElementCount).to.equal(4) 10 | }) 11 | 12 | it('array spread', async () => { 13 | const doc = await initDOM('array-spread') 14 | 15 | expect(doc.getElementById('feature-array-spread').childElementCount).to.equal(4) 16 | }) 17 | 18 | it('async/await', async () => { 19 | const doc = await initDOM('async-await') 20 | 21 | expect(doc.getElementById('feature-async-await').childElementCount).to.equal(4) 22 | }) 23 | 24 | it('class properties', async () => { 25 | const doc = await initDOM('class-properties') 26 | 27 | expect(doc.getElementById('feature-class-properties').childElementCount).to.equal(4) 28 | }) 29 | 30 | it('computed properties', async () => { 31 | const doc = await initDOM('computed-properties') 32 | 33 | expect(doc.getElementById('feature-computed-properties').childElementCount).to.equal(4) 34 | }) 35 | 36 | it('custom interpolation', async () => { 37 | const doc = await initDOM('custom-interpolation') 38 | 39 | expect(doc.getElementById('feature-custom-interpolation').childElementCount).to.equal(4) 40 | }) 41 | 42 | it('default parameters', async () => { 43 | const doc = await initDOM('default-parameters') 44 | 45 | expect(doc.getElementById('feature-default-parameters').childElementCount).to.equal(4) 46 | }) 47 | 48 | it('destructuring and await', async () => { 49 | const doc = await initDOM('destructuring-and-await') 50 | 51 | expect(doc.getElementById('feature-destructuring-and-await').childElementCount).to.equal(4) 52 | }) 53 | 54 | it('generators', async () => { 55 | const doc = await initDOM('generators') 56 | 57 | expect(doc.getElementById('feature-generators').childElementCount).to.equal(4) 58 | }) 59 | 60 | it('object destructuring', async () => { 61 | const doc = await initDOM('object-destructuring') 62 | 63 | expect(doc.getElementById('feature-object-destructuring').childElementCount).to.equal(4) 64 | }) 65 | 66 | it('object spread', async () => { 67 | const doc = await initDOM('object-spread') 68 | 69 | expect(doc.getElementById('feature-object-spread').childElementCount).to.equal(4) 70 | }) 71 | 72 | it('promises', async () => { 73 | const doc = await initDOM('promises') 74 | 75 | expect(doc.getElementById('feature-promises').childElementCount).to.equal(4) 76 | }) 77 | 78 | it('rest + default', async () => { 79 | const doc = await initDOM('rest-and-default') 80 | 81 | expect(doc.getElementById('feature-rest-and-default').childElementCount).to.equal(4) 82 | }) 83 | 84 | it('rest parameters', async () => { 85 | const doc = await initDOM('rest-parameters') 86 | 87 | expect(doc.getElementById('feature-rest-parameters').childElementCount).to.equal(4) 88 | }) 89 | 90 | it('template interpolation', async () => { 91 | const doc = await initDOM('template-interpolation') 92 | 93 | expect(doc.getElementById('feature-template-interpolation').childElementCount).to.equal(4) 94 | }) 95 | }) 96 | }) 97 | -------------------------------------------------------------------------------- /examples/relay/libs/setupRelay.js: -------------------------------------------------------------------------------- 1 | const chalk = require('chalk'); 2 | const fetch = require('node-fetch'); 3 | const graphQlutilities = require('graphql/utilities'); 4 | const fs = require('fs'); 5 | require('dotenv').config({silent: true}); 6 | 7 | const relay = require('./relay'); 8 | 9 | const requireGraphQlConfig = function() { 10 | return new Promise((resolve, reject) => { 11 | if (!process.env.GRAPHQL_ENDPOINT) { 12 | reject(new Error( 13 | chalk.red('Relay requires a url to your graphql server\n') + 14 | 'Specifiy this in a ' + chalk.cyan('GRAPHQL_ENDPOINT') + ' environment variable.' 15 | )); 16 | } else { 17 | console.log(chalk.green("Relay support - GRAPHQL_ENDPOINT configured successfully")); 18 | resolve(); 19 | } 20 | }); 21 | } 22 | 23 | const loadSchema = function() { 24 | return new Promise((resolve, reject) => { 25 | if (!fs.existsSync(relay.schemaPath)) { 26 | reject(new Error( 27 | chalk.yellow('Relay support - babel-relay-plugin didn\'t find graphql-schema.json\n') 28 | )); 29 | } else { 30 | console.log(chalk.green("Relay support - graphql-schema.json find")); 31 | resolve() 32 | } 33 | }) 34 | } 35 | 36 | var validateSchemaJson = function () { 37 | return new Promise((resolve, reject) => { 38 | var schemaFileContents = fs.readFileSync(relay.schemaPath); 39 | // check that schema.json is valid json 40 | var schemaJSON; 41 | try { 42 | schemaJSON = JSON.parse(schemaFileContents); 43 | } catch (err) { 44 | return reject(new Error( 45 | chalk.red('JSON parsing of the contents of graphql-schema.json failed.\n') + 46 | 'Check the contents of ' + relay.schemaPath + '. It does not appear to be valid json\n' 47 | )); 48 | } 49 | 50 | try { 51 | graphQlutilities.buildClientSchema(schemaJSON.data); 52 | } catch (err) { 53 | reject(new Error( 54 | chalk.red('Could not parse the contents of schema.json into a valid graphql schema that is compatiable with this version of Relay and babel-relay-plugin\n') + 55 | 'Upgrading graphql library on your server may be a solution.' 56 | )); 57 | } 58 | 59 | console.log('Relay support - schema is valid'); 60 | resolve(); 61 | }); 62 | } 63 | 64 | // retreive JSON of graaphql schema via introspection for Babel Relay Plugin to use 65 | var fetchRelaySchema = function () { 66 | console.log('Relay support - fetching schema from ' + chalk.cyan(process.env.GRAPHQL_ENDPOINT)); 67 | return fetch(process.env.GRAPHQL_ENDPOINT, { 68 | method: 'POST', 69 | headers: { 70 | 'Accept': 'application/json', 71 | 'Content-Type': 'application/json' 72 | }, 73 | body: JSON.stringify({'query': graphQlutilities.introspectionQuery}), 74 | }) 75 | .then(res => res.json()).then(schemaJSON => { 76 | // verify that the schemaJSON is valid a graphQL Schema 77 | var graphQLSchema = graphQlutilities.buildClientSchema(schemaJSON.data); 78 | // Save relay compatible schema.json 79 | fs.writeFileSync(relay.schemaPath, JSON.stringify(schemaJSON, null, 2)); 80 | 81 | // Save user readable schema.graphql 82 | fs.writeFileSync(relay.schemaPath.replace('.json', '.graphql'), graphQlutilities.printSchema(graphQLSchema)); 83 | console.log(chalk.green('Relay support - GraphQL schema successfully fetched')); 84 | }); 85 | } 86 | 87 | requireGraphQlConfig() 88 | .then(loadSchema) 89 | .catch(fetchRelaySchema) 90 | .then(validateSchemaJson) 91 | .then(() => { 92 | console.log(chalk.green('Relay support everything configured successfully!')); 93 | }, function(e){ 94 | console.log(e.message); 95 | process.exit("Seomthing went wrong :D"); 96 | }); -------------------------------------------------------------------------------- /packages/babel-preset-react-app/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 'use strict'; 10 | 11 | var path = require('path'); 12 | 13 | const plugins = [ 14 | // class { handleClick = () => { } } 15 | require.resolve('babel-plugin-transform-class-properties'), 16 | // The following two plugins use Object.assign directly, instead of Babel's 17 | // extends helper. Note that this assumes `Object.assign` is available. 18 | // { ...todo, completed: true } 19 | [require.resolve('babel-plugin-transform-object-rest-spread'), { 20 | useBuiltIns: true 21 | }], 22 | // Transforms JSX 23 | [require.resolve('babel-plugin-transform-react-jsx'), { 24 | useBuiltIns: true 25 | }], 26 | // Polyfills the runtime needed for async/await and generators 27 | [require.resolve('babel-plugin-transform-runtime'), { 28 | helpers: false, 29 | polyfill: false, 30 | regenerator: true, 31 | // Resolve the Babel runtime relative to the config. 32 | moduleName: path.dirname(require.resolve('babel-runtime/package')) 33 | }] 34 | ]; 35 | 36 | // This is similar to how `env` works in Babel: 37 | // https://babeljs.io/docs/usage/babelrc/#env-option 38 | // We are not using `env` because it’s ignored in versions > babel-core@6.10.4: 39 | // https://github.com/babel/babel/issues/4539 40 | // https://github.com/facebookincubator/create-react-app/issues/720 41 | // It’s also nice that we can enforce `NODE_ENV` being specified. 42 | var env = process.env.BABEL_ENV || process.env.NODE_ENV; 43 | if (env !== 'development' && env !== 'test' && env !== 'production') { 44 | throw new Error( 45 | 'Using `babel-preset-react-app` requires that you specify `NODE_ENV` or '+ 46 | '`BABEL_ENV` environment variables. Valid values are "development", ' + 47 | '"test", and "production". Instead, received: ' + JSON.stringify(env) + '.' 48 | ); 49 | } 50 | 51 | if (env === 'development' || env === 'test') { 52 | // The following two plugins are currently necessary to make React warnings 53 | // include more valuable information. They are included here because they are 54 | // currently not enabled in babel-preset-react. See the below threads for more info: 55 | // https://github.com/babel/babel/issues/4702 56 | // https://github.com/babel/babel/pull/3540#issuecomment-228673661 57 | // https://github.com/facebookincubator/create-react-app/issues/989 58 | plugins.push.apply(plugins, [ 59 | // Adds component stack to warning messages 60 | require.resolve('babel-plugin-transform-react-jsx-source'), 61 | // Adds __self attribute to JSX which React will use for some warnings 62 | require.resolve('babel-plugin-transform-react-jsx-self') 63 | ]); 64 | } 65 | 66 | if (env === 'test') { 67 | plugins.push.apply(plugins, [ 68 | // We always include this plugin regardless of environment 69 | // because of a Babel bug that breaks object rest/spread without it: 70 | // https://github.com/babel/babel/issues/4851 71 | require.resolve('babel-plugin-transform-es2015-parameters') 72 | ]); 73 | 74 | module.exports = { 75 | presets: [ 76 | // ES features necessary for user's Node version 77 | [require('babel-preset-env').default, { 78 | targets: { 79 | node: 'current', 80 | }, 81 | }], 82 | // JSX, Flow 83 | require.resolve('babel-preset-react') 84 | ], 85 | plugins: plugins 86 | }; 87 | } else { 88 | module.exports = { 89 | presets: [ 90 | // Latest stable ECMAScript features 91 | [require.resolve('babel-preset-latest'), { 92 | 'es2015': { 93 | modules: false 94 | } 95 | }], 96 | // JSX, Flow 97 | require.resolve('babel-preset-react') 98 | ], 99 | plugins: plugins.concat([ 100 | // function* () { yield 42; yield 43; } 101 | [require.resolve('babel-plugin-transform-regenerator'), { 102 | // Async functions are converted to generators by babel-preset-latest 103 | async: false 104 | }], 105 | ]) 106 | }; 107 | 108 | if (env === 'production') { 109 | // Optimization: hoist JSX that never changes out of render() 110 | // Disabled because of issues: 111 | // * https://github.com/facebookincubator/create-react-app/issues/525 112 | // * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/ 113 | // * https://github.com/babel/babel/issues/4516 114 | // TODO: Enable again when these issues are resolved. 115 | // plugins.push.apply(plugins, [ 116 | // require.resolve('babel-plugin-transform-react-constant-elements') 117 | // ]); 118 | } 119 | } 120 | -------------------------------------------------------------------------------- /packages/react-dev-utils/formatWebpackMessages.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | // WARNING: this code is untranspiled and is used in browser too. 11 | // Please make sure any changes are in ES5 or contribute a Babel compile step. 12 | 13 | // Some custom utilities to prettify Webpack output. 14 | // This is quite hacky and hopefully won't be needed when Webpack fixes this. 15 | // https://github.com/webpack/webpack/issues/2878 16 | 17 | var friendlySyntaxErrorLabel = 'Syntax error:'; 18 | 19 | function isLikelyASyntaxError(message) { 20 | return message.indexOf(friendlySyntaxErrorLabel) !== -1; 21 | } 22 | 23 | // Cleans up webpack error messages. 24 | function formatMessage(message) { 25 | var lines = message.split('\n'); 26 | 27 | // Remove webpack-specific loader notation from filename. 28 | // Before: 29 | // ./~/css-loader!./~/postcss-loader!./src/App.css 30 | // After: 31 | // ./src/App.css 32 | if (lines[0].lastIndexOf('!') !== -1) { 33 | lines[0] = lines[0].substr(lines[0].lastIndexOf('!') + 1); 34 | } 35 | 36 | // line #0 is filename 37 | // line #1 is the main error message 38 | if (!lines[0] || !lines[1]) { 39 | return lines.join('\n'); 40 | } 41 | 42 | // Cleans up verbose "module not found" messages for files and packages. 43 | if (lines[1].indexOf('Module not found: ') === 0) { 44 | lines = [ 45 | lines[0], 46 | // Clean up message because "Module not found: " is descriptive enough. 47 | lines[1].replace( 48 | 'Cannot resolve \'file\' or \'directory\' ', '' 49 | ).replace( 50 | 'Cannot resolve module ', '' 51 | ).replace( 52 | 'Error: ', '' 53 | ), 54 | // Skip all irrelevant lines. 55 | // (For some reason they only appear on the client in browser.) 56 | '', 57 | lines[lines.length - 1] // error location is the last line 58 | ] 59 | } 60 | 61 | // Cleans up syntax error messages. 62 | if (lines[1].indexOf('Module build failed: ') === 0) { 63 | // For some reason, on the client messages appear duplicated: 64 | // https://github.com/webpack/webpack/issues/3008 65 | // This won't happen in Node but since we share this helpers, 66 | // we will dedupe them right here. We will ignore all lines 67 | // after the original error message text is repeated the second time. 68 | var errorText = lines[1].substr('Module build failed: '.length); 69 | var cleanedLines = []; 70 | var hasReachedDuplicateMessage = false; 71 | // Gather lines until we reach the beginning of duplicate message. 72 | lines.forEach(function(line, index) { 73 | if ( 74 | // First time it occurs is fine. 75 | index !== 1 && 76 | // line.endsWith(errorText) 77 | line.length >= errorText.length && 78 | line.indexOf(errorText) === line.length - errorText.length 79 | ) { 80 | // We see the same error message for the second time! 81 | // Filter out repeated error message and everything after it. 82 | hasReachedDuplicateMessage = true; 83 | } 84 | if ( 85 | !hasReachedDuplicateMessage || 86 | // Print last line anyway because it contains the source location 87 | index === lines.length - 1 88 | ) { 89 | // This line is OK to appear in the output. 90 | cleanedLines.push(line); 91 | } 92 | }); 93 | // We are clean now! 94 | lines = cleanedLines; 95 | // Finally, brush up the error message a little. 96 | lines[1] = lines[1].replace( 97 | 'Module build failed: SyntaxError:', 98 | friendlySyntaxErrorLabel 99 | ); 100 | } 101 | 102 | // Reassemble the message. 103 | message = lines.join('\n'); 104 | // Internal stacks are generally useless so we strip them... with the 105 | // exception of stacks containing `webpack:` because they're normally 106 | // from user code generated by WebPack. For more information see 107 | // https://github.com/facebookincubator/create-react-app/pull/1050 108 | message = message.replace( 109 | /^\s*at\s((?!webpack:).)*:\d+:\d+[\s\)]*(\n|$)/gm, '' 110 | ); // at ... ...:x:y 111 | 112 | return message; 113 | } 114 | 115 | function formatWebpackMessages(json) { 116 | var formattedErrors = json.errors.map(function(message) { 117 | return 'Error in ' + formatMessage(message) 118 | }); 119 | var formattedWarnings = json.warnings.map(function(message) { 120 | return 'Warning in ' + formatMessage(message) 121 | }); 122 | var result = { 123 | errors: formattedErrors, 124 | warnings: formattedWarnings 125 | }; 126 | if (result.errors.some(isLikelyASyntaxError)) { 127 | // If there are any syntax errors, show just them. 128 | // This prevents a confusing ESLint parsing error 129 | // preceding a much more useful Babel syntax error. 130 | result.errors = result.errors.filter(isLikelyASyntaxError); 131 | } 132 | return result; 133 | } 134 | 135 | module.exports = formatWebpackMessages; 136 | -------------------------------------------------------------------------------- /tasks/e2e-installs.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | # Copyright (c) 2015-present, Facebook, Inc. 3 | # All rights reserved. 4 | # 5 | # This source code is licensed under the BSD-style license found in the 6 | # LICENSE file in the root directory of this source tree. An additional grant 7 | # of patent rights can be found in the PATENTS file in the same directory. 8 | 9 | # ****************************************************************************** 10 | # This is an end-to-end test intended to run on CI. 11 | # You can also run it locally but it's slow. 12 | # ****************************************************************************** 13 | 14 | # Start in tasks/ even if run from root directory 15 | cd "$(dirname "$0")" 16 | 17 | # CLI and app temporary locations 18 | # http://unix.stackexchange.com/a/84980 19 | temp_cli_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_cli_path'` 20 | temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'` 21 | 22 | function cleanup { 23 | echo 'Cleaning up.' 24 | cd $root_path 25 | rm -rf $temp_cli_path $temp_app_path 26 | } 27 | 28 | # Error messages are redirected to stderr 29 | function handle_error { 30 | echo "$(basename $0): ERROR! An error was encountered executing line $1." 1>&2; 31 | cleanup 32 | echo 'Exiting with error.' 1>&2; 33 | exit 1 34 | } 35 | 36 | function handle_exit { 37 | cleanup 38 | echo 'Exiting without error.' 1>&2; 39 | exit 40 | } 41 | 42 | # Check for the existence of one or more files. 43 | function exists { 44 | for f in $*; do 45 | test -e "$f" 46 | done 47 | } 48 | 49 | function create_react_app { 50 | node "$temp_cli_path"/node_modules/create-react-app/index.js $* 51 | } 52 | 53 | # Exit the script with a helpful error message when any error is encountered 54 | trap 'set +x; handle_error $LINENO $BASH_COMMAND' ERR 55 | 56 | # Cleanup before exit on any termination signal 57 | trap 'set +x; handle_exit' SIGQUIT SIGTERM SIGINT SIGKILL SIGHUP 58 | 59 | # Echo every command being executed 60 | set -x 61 | 62 | # Go to root 63 | cd .. 64 | root_path=$PWD 65 | 66 | npm install 67 | 68 | if [ "$USE_YARN" = "yes" ] 69 | then 70 | # Install Yarn so that the test can use it to install packages. 71 | npm install -g yarn@0.17.10 # TODO: remove version when https://github.com/yarnpkg/yarn/issues/2142 is fixed. 72 | yarn cache clean 73 | fi 74 | 75 | # ****************************************************************************** 76 | # First, pack and install create-react-app. 77 | # ****************************************************************************** 78 | 79 | # Pack CLI 80 | cd $root_path/packages/create-react-app 81 | cli_path=$PWD/`npm pack` 82 | 83 | # Install the CLI in a temporary location 84 | cd $temp_cli_path 85 | npm install $cli_path 86 | 87 | # ****************************************************************************** 88 | # Test --scripts-version with a version number 89 | # ****************************************************************************** 90 | 91 | cd $temp_app_path 92 | create_react_app --scripts-version=0.4.0 test-app-version-number 93 | cd test-app-version-number 94 | 95 | # Check corresponding scripts version is installed. 96 | exists node_modules/react-scripts 97 | grep '"version": "0.4.0"' node_modules/react-scripts/package.json 98 | 99 | # ****************************************************************************** 100 | # Test --scripts-version with a tarball url 101 | # ****************************************************************************** 102 | 103 | cd $temp_app_path 104 | create_react_app --scripts-version=https://registry.npmjs.org/react-scripts/-/react-scripts-0.4.0.tgz test-app-tarball-url 105 | cd test-app-tarball-url 106 | 107 | # Check corresponding scripts version is installed. 108 | exists node_modules/react-scripts 109 | grep '"version": "0.4.0"' node_modules/react-scripts/package.json 110 | 111 | # ****************************************************************************** 112 | # Test --scripts-version with a custom fork of react-scripts 113 | # ****************************************************************************** 114 | 115 | cd $temp_app_path 116 | create_react_app --scripts-version=react-scripts-fork test-app-fork 117 | cd test-app-fork 118 | 119 | # Check corresponding scripts version is installed. 120 | exists node_modules/react-scripts-fork 121 | 122 | # ****************************************************************************** 123 | # Test nested folder path as the project name 124 | # ****************************************************************************** 125 | 126 | #Testing a path that exists 127 | cd $temp_app_path 128 | mkdir test-app-nested-paths-t1 129 | cd test-app-nested-paths-t1 130 | mkdir -p test-app-nested-paths-t1/aa/bb/cc/dd 131 | create_react_app test-app-nested-paths-t1/aa/bb/cc/dd 132 | cd test-app-nested-paths-t1/aa/bb/cc/dd 133 | npm start -- --smoke-test 134 | 135 | #Testing a path that does not exist 136 | cd $temp_app_path 137 | create_react_app test-app-nested-paths-t2/aa/bb/cc/dd 138 | cd test-app-nested-paths-t2/aa/bb/cc/dd 139 | npm start -- --smoke-test 140 | 141 | #Testing a path that is half exists 142 | cd $temp_app_path 143 | mkdir -p test-app-nested-paths-t3/aa 144 | create_react_app test-app-nested-paths-t3/aa/bb/cc/dd 145 | cd test-app-nested-paths-t3/aa/bb/cc/dd 146 | npm start -- --smoke-test 147 | 148 | # Cleanup 149 | cleanup 150 | -------------------------------------------------------------------------------- /packages/react-scripts/fixtures/kitchensink/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component, PropTypes, createElement } from 'react'; 2 | 3 | class BuiltEmitter extends Component { 4 | static propTypes = { 5 | feature: PropTypes.func.isRequired 6 | } 7 | 8 | componentDidMount() { 9 | const { feature } = this.props; 10 | 11 | // Class components must call this.props.onReady when they're ready for the test. 12 | // We will assume functional components are ready immediately after mounting. 13 | if (!Component.isPrototypeOf(feature)) { 14 | this.handleReady(); 15 | } 16 | } 17 | 18 | handleReady() { 19 | document.dispatchEvent(new Event('ReactFeatureDidMount')); 20 | } 21 | 22 | render() { 23 | const { 24 | props: { feature }, 25 | handleReady 26 | } = this; 27 | return ( 28 |
29 | {createElement(feature, { 30 | onReady: handleReady 31 | })} 32 |
33 | ); 34 | } 35 | } 36 | 37 | class App extends Component { 38 | constructor(props) { 39 | super(props); 40 | 41 | this.state = { feature: null }; 42 | 43 | this.setFeature = this.setFeature.bind(this); 44 | } 45 | 46 | componentDidMount() { 47 | const feature = location.hash.slice(1); 48 | switch (feature) { 49 | case 'array-destructuring': 50 | require.ensure([], () => this.setFeature(require('./features/syntax/ArrayDestructuring').default)); 51 | break; 52 | case 'array-spread': 53 | require.ensure([], () => this.setFeature(require('./features/syntax/ArraySpread').default)); 54 | break; 55 | case 'async-await': 56 | require.ensure([], () => this.setFeature(require('./features/syntax/AsyncAwait').default)); 57 | break; 58 | case 'class-properties': 59 | require.ensure([], () => this.setFeature(require('./features/syntax/ClassProperties').default)); 60 | break; 61 | case 'computed-properties': 62 | require.ensure([], () => this.setFeature(require('./features/syntax/ComputedProperties').default)); 63 | break; 64 | case 'css-inclusion': 65 | require.ensure([], () => this.setFeature(require('./features/webpack/CssInclusion').default)); 66 | break; 67 | case 'custom-interpolation': 68 | require.ensure([], () => this.setFeature(require('./features/syntax/CustomInterpolation').default)); 69 | break; 70 | case 'default-parameters': 71 | require.ensure([], () => this.setFeature(require('./features/syntax/DefaultParameters').default)); 72 | break; 73 | case 'destructuring-and-await': 74 | require.ensure([], () => this.setFeature(require('./features/syntax/DestructuringAndAwait').default)); 75 | break; 76 | case 'file-env-variables': 77 | require.ensure([], () => this.setFeature(require('./features/env/FileEnvVariables').default)); 78 | break; 79 | case 'generators': 80 | require.ensure([], () => this.setFeature(require('./features/syntax/Generators').default)); 81 | break; 82 | case 'image-inclusion': 83 | require.ensure([], () => this.setFeature(require('./features/webpack/ImageInclusion').default)); 84 | break; 85 | case 'json-inclusion': 86 | require.ensure([], () => this.setFeature(require('./features/webpack/JsonInclusion').default)); 87 | break; 88 | case 'node-path': 89 | require.ensure([], () => this.setFeature(require('./features/env/NodePath').default)); 90 | break; 91 | case 'no-ext-inclusion': 92 | require.ensure([], () => this.setFeature(require('./features/webpack/NoExtInclusion').default)); 93 | break; 94 | case 'object-destructuring': 95 | require.ensure([], () => this.setFeature(require('./features/syntax/ObjectDestructuring').default)); 96 | break; 97 | case 'object-spread': 98 | require.ensure([], () => this.setFeature(require('./features/syntax/ObjectSpread').default)); 99 | break; 100 | case 'promises': 101 | require.ensure([], () => this.setFeature(require('./features/syntax/Promises').default)); 102 | break; 103 | case 'public-url': 104 | require.ensure([], () => this.setFeature(require('./features/env/PublicUrl').default)); 105 | break; 106 | case 'rest-and-default': 107 | require.ensure([], () => this.setFeature(require('./features/syntax/RestAndDefault').default)); 108 | break; 109 | case 'rest-parameters': 110 | require.ensure([], () => this.setFeature(require('./features/syntax/RestParameters').default)); 111 | break; 112 | case 'shell-env-variables': 113 | require.ensure([], () => this.setFeature(require('./features/env/ShellEnvVariables').default)); 114 | break; 115 | case 'svg-inclusion': 116 | require.ensure([], () => this.setFeature(require('./features/webpack/SvgInclusion').default)); 117 | break; 118 | case 'template-interpolation': 119 | require.ensure([], () => this.setFeature(require('./features/syntax/TemplateInterpolation').default)); 120 | break; 121 | case 'unknown-ext-inclusion': 122 | require.ensure([], () => this.setFeature(require('./features/webpack/UnknownExtInclusion').default)); 123 | break; 124 | default: throw new Error(`Missing feature "${feature}"`); 125 | } 126 | } 127 | 128 | setFeature(feature) { 129 | this.setState({ feature }); 130 | } 131 | 132 | render() { 133 | const { feature } = this.state; 134 | if (feature !== null) { 135 | return ; 136 | } 137 | return null; 138 | } 139 | } 140 | 141 | export default App; 142 | -------------------------------------------------------------------------------- /packages/react-scripts/scripts/init.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | var fs = require('fs-extra'); 11 | var path = require('path'); 12 | var spawn = require('cross-spawn'); 13 | var chalk = require('chalk'); 14 | 15 | module.exports = function(appPath, appName, verbose, originalDirectory, template) { 16 | var ownPackageName = require(path.join(__dirname, '..', 'package.json')).name; 17 | var ownPath = path.join(appPath, 'node_modules', ownPackageName); 18 | var appPackage = require(path.join(appPath, 'package.json')); 19 | var useYarn = fs.existsSync(path.join(appPath, 'yarn.lock')); 20 | 21 | // Copy over some of the devDependencies 22 | appPackage.dependencies = appPackage.dependencies || {}; 23 | appPackage.devDependencies = appPackage.devDependencies || {}; 24 | 25 | // Setup the script rules 26 | appPackage.scripts = { 27 | 'start': 'react-scripts start', 28 | 'build': 'react-scripts build', 29 | 'test': 'react-scripts test --env=jsdom', 30 | 'eject': 'react-scripts eject' 31 | }; 32 | 33 | fs.writeFileSync( 34 | path.join(appPath, 'package.json'), 35 | JSON.stringify(appPackage, null, 2) 36 | ); 37 | 38 | var readmeExists = fs.existsSync(path.join(appPath, 'README.md')); 39 | if (readmeExists) { 40 | fs.renameSync(path.join(appPath, 'README.md'), path.join(appPath, 'README.old.md')); 41 | } 42 | 43 | // Copy the files for the user 44 | var templatePath = template ? path.resolve(originalDirectory, template) : path.join(ownPath, 'template'); 45 | if (fs.existsSync(templatePath)) { 46 | fs.copySync(templatePath, appPath); 47 | } else { 48 | console.error('Could not locate supplied template: ' + chalk.green(templatePath)); 49 | return; 50 | } 51 | 52 | // Rename gitignore after the fact to prevent npm from renaming it to .npmignore 53 | // See: https://github.com/npm/npm/issues/1862 54 | fs.move(path.join(appPath, 'gitignore'), path.join(appPath, '.gitignore'), [], function (err) { 55 | if (err) { 56 | // Append if there's already a `.gitignore` file there 57 | if (err.code === 'EEXIST') { 58 | var data = fs.readFileSync(path.join(appPath, 'gitignore')); 59 | fs.appendFileSync(path.join(appPath, '.gitignore'), data); 60 | fs.unlinkSync(path.join(appPath, 'gitignore')); 61 | } else { 62 | throw err; 63 | } 64 | } 65 | }); 66 | 67 | // Run yarn or npm for react and react-dom 68 | // TODO: having to do two npm/yarn installs is bad, can we avoid it? 69 | var command; 70 | var args; 71 | 72 | if (useYarn) { 73 | command = 'yarnpkg'; 74 | args = ['add']; 75 | } else { 76 | command = 'npm'; 77 | args = [ 78 | 'install', 79 | '--save', 80 | verbose && '--verbose' 81 | ].filter(function(e) { return e; }); 82 | } 83 | args.push('react', 'react-dom'); 84 | 85 | // Install additional template dependencies, if present 86 | var templateDependenciesPath = path.join(appPath, '.template.dependencies.json'); 87 | if (fs.existsSync(templateDependenciesPath)) { 88 | var templateDependencies = require(templateDependenciesPath).dependencies; 89 | args = args.concat(Object.keys(templateDependencies).map(function (key) { 90 | return key + '@' + templateDependencies[key]; 91 | })); 92 | fs.unlinkSync(templateDependenciesPath); 93 | } 94 | 95 | console.log('Installing react and react-dom using ' + command + '...'); 96 | console.log(); 97 | 98 | var proc = spawn(command, args, {stdio: 'inherit'}); 99 | proc.on('close', function (code) { 100 | if (code !== 0) { 101 | console.error('`' + command + ' ' + args.join(' ') + '` failed'); 102 | return; 103 | } 104 | 105 | // Display the most elegant way to cd. 106 | // This needs to handle an undefined originalDirectory for 107 | // backward compatibility with old global-cli's. 108 | var cdpath; 109 | if (originalDirectory && 110 | path.join(originalDirectory, appName) === appPath) { 111 | cdpath = appName; 112 | } else { 113 | cdpath = appPath; 114 | } 115 | 116 | console.log(); 117 | console.log('Success! Created ' + appName + ' at ' + appPath); 118 | console.log('Inside that directory, you can run several commands:'); 119 | console.log(); 120 | console.log(chalk.cyan(' ' + command + ' start')); 121 | console.log(' Starts the development server.'); 122 | console.log(); 123 | console.log(chalk.cyan(' ' + command + ' run build')); 124 | console.log(' Bundles the app into static files for production.'); 125 | console.log(); 126 | console.log(chalk.cyan(' ' + command + ' test')); 127 | console.log(' Starts the test runner.'); 128 | console.log(); 129 | console.log(chalk.cyan(' ' + command + ' run eject')); 130 | console.log(' Removes this tool and copies build dependencies, configuration files'); 131 | console.log(' and scripts into the app directory. If you do this, you can’t go back!'); 132 | console.log(); 133 | console.log('We suggest that you begin by typing:'); 134 | console.log(); 135 | console.log(chalk.cyan(' cd'), cdpath); 136 | console.log(' ' + chalk.cyan(command + ' start')); 137 | if (readmeExists) { 138 | console.log(); 139 | console.log(chalk.yellow('You had a `README.md` file, we renamed it to `README.old.md`')); 140 | } 141 | console.log(); 142 | console.log('Happy hacking!'); 143 | }); 144 | }; 145 | -------------------------------------------------------------------------------- /packages/react-scripts/config/paths.js: -------------------------------------------------------------------------------- 1 | // @remove-on-eject-begin 2 | /** 3 | * Copyright (c) 2015-present, Facebook, Inc. 4 | * All rights reserved. 5 | * 6 | * This source code is licensed under the BSD-style license found in the 7 | * LICENSE file in the root directory of this source tree. An additional grant 8 | * of patent rights can be found in the PATENTS file in the same directory. 9 | */ 10 | // @remove-on-eject-end 11 | 12 | var path = require('path'); 13 | var fs = require('fs'); 14 | var url = require('url'); 15 | 16 | // Make sure any symlinks in the project folder are resolved: 17 | // https://github.com/facebookincubator/create-react-app/issues/637 18 | var appDirectory = fs.realpathSync(process.cwd()); 19 | function resolveApp(relativePath) { 20 | return path.resolve(appDirectory, relativePath); 21 | } 22 | 23 | // We support resolving modules according to `NODE_PATH`. 24 | // This lets you use absolute paths in imports inside large monorepos: 25 | // https://github.com/facebookincubator/create-react-app/issues/253. 26 | 27 | // It works similar to `NODE_PATH` in Node itself: 28 | // https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders 29 | 30 | // We will export `nodePaths` as an array of absolute paths. 31 | // It will then be used by Webpack configs. 32 | // Jest doesn’t need this because it already handles `NODE_PATH` out of the box. 33 | 34 | // Note that unlike in Node, only *relative* paths from `NODE_PATH` are honored. 35 | // Otherwise, we risk importing Node.js core modules into an app instead of Webpack shims. 36 | // https://github.com/facebookincubator/create-react-app/issues/1023#issuecomment-265344421 37 | 38 | var nodePaths = (process.env.NODE_PATH || '') 39 | .split(process.platform === 'win32' ? ';' : ':') 40 | .filter(Boolean) 41 | .filter(folder => !path.isAbsolute(folder)) 42 | .map(resolveApp); 43 | 44 | var envPublicUrl = process.env.PUBLIC_URL; 45 | 46 | function ensureSlash(path, needsSlash) { 47 | var hasSlash = path.endsWith('/'); 48 | if (hasSlash && !needsSlash) { 49 | return path.substr(path, path.length - 1); 50 | } else if (!hasSlash && needsSlash) { 51 | return path + '/'; 52 | } else { 53 | return path; 54 | } 55 | } 56 | 57 | function getPublicUrl(appPackageJson) { 58 | return envPublicUrl || require(appPackageJson).homepage; 59 | } 60 | 61 | // We use `PUBLIC_URL` environment variable or "homepage" field to infer 62 | // "public path" at which the app is served. 63 | // Webpack needs to know it to put the right