Merge branch 'master' into port-option-for-npm-start

Author: chocnut

CONTRIBUTING.md

@@ -0,0 +1,42 @@
+# Contributing to `create-react-app`
+
+♥ `create-react-app` and want to get involved? Thanks! There are plenty of ways you can help!
+
+Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved.
+
+Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue or assessing patches and features.
+
+## Core ideas
+
+We do not want any flags or configuration, that would defeat the purpose of this tool. We want to find good defaults and actively find ways to improve the developer experience.
+
+We try not to make any controversial choices. If the community is split between different tools, we won't just pick the least controversial or most popular, the tool itself should be agnostic between them.
+
+*These ideas are subject to change at any time*
+
+## Submitting a Pull Request
+
+Good pull requests - patches, improvements, new features - are a fantastic help. They should remain focused in scope and avoid containing unrelated commits.
+
+Please **ask first** if somebody else is already working on this or the core developers think your feature is in-scope for `create-react-app`. Generally always have a related issue with discussions for whatever you are including.
+
+Please also provide a **test plan**, i.e. specify how you verified what you added works.
+
+## Setting up a local copy of the repository
+
+1. Clone the repo with `git clone https://github.com/facebookincubator/create-react-app`
+
+2. Run `npm install` in the root `create-react-app` folder **and** the `create-react-app/global-cli` folder
+
+Once it is done, you can modify any file locally and run `npm start` or `npm run build` just like in a generated project.
+
+If you want to try out the end-to-end flow with the global CLI, you can do this too:
+
+```
+npm run create-react-app my-app
+cd my-app
+```
+
+and then run `npm start` or `npm run build`.
+
+*Many thanks to [h5bp](https://github.com/h5bp/html5-boilerplate/blob/master/CONTRIBUTING.md) for the inspiration with this contributing guide*

README.md

@@ -146,17 +146,7 @@ All of them are transient dependencies of the provided npm package.
 
 ## Contributing
 
-Clone the repo and run `npm install` in the root and the `global-cli` folder.
-
-Once it is done, you can modify any file locally and run `npm start` or `npm run build` just like in a generated project.
-If you want to try out the end-to-end flow with the global CLI, you can do this too:
-
-```
-npm run create-react-app my-app
-cd my-app
-```
-
-and then run `npm start` or `npm run build`.
+We'd love to have your helping hand on `create-react-app`! See [CONTRIBUTING.md](CONTRIBUTING.md) for more information on what we're looking for and how to get started.
 
 ## Acknowledgements
 

config/eslint.js

@@ -179,10 +179,6 @@ module.exports = {
 
     // https://github.com/yannickcr/eslint-plugin-react/tree/master/docs/rules
     'react/jsx-equals-spacing': [WARNING, 'never'],
-    'react/jsx-handler-names': [WARNING, {
-      eventHandlerPrefix: 'handle',
-      eventHandlerPropPrefix: 'on',
-    }],
     'react/jsx-no-duplicate-props': [WARNING, { ignoreCase: true }],
     'react/jsx-no-undef': WARNING,
     'react/jsx-pascal-case': [WARNING, {

config/webpack.config.prod.js

@@ -12,6 +12,7 @@ var autoprefixer = require('autoprefixer');
 var webpack = require('webpack');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var url = require('url');
 
 // TODO: hide this behind a flag and eliminate dead code on eject.
 // This shouldn't be exposed to the user.
@@ -26,6 +27,12 @@ var nodeModulesPath = path.join(__dirname, '..', 'node_modules');
 var indexHtmlPath = path.resolve(__dirname, relativePath, 'index.html');
 var faviconPath = path.resolve(__dirname, relativePath, 'favicon.ico');
 var buildPath = path.join(__dirname, isInNodeModules ? '../../..' : '..', 'build');
+var homepagePath = require(path.resolve(__dirname, relativePath, 'package.json')).homepage;
+var publicPath = homepagePath ? url.parse(homepagePath).pathname : '/';
+if (!publicPath.endsWith('/')) {
+  // Prevents incorrect paths in file-loader
+  publicPath += '/';
+}
 
 module.exports = {
   bail: true,
@@ -35,9 +42,7 @@ module.exports = {
     path: buildPath,
     filename: '[name].[chunkhash].js',
     chunkFilename: '[name].[chunkhash].chunk.js',
-    // TODO: this wouldn't work for e.g. GH Pages.
-    // Good news: we can infer it from package.json :-)
-    publicPath: '/'
+    publicPath: publicPath
   },
   resolve: {
     extensions: ['', '.js'],

scripts/build.js

@@ -16,8 +16,13 @@ var config = require('../config/webpack.config.prod');
 
 var isInNodeModules = 'node_modules' ===
   path.basename(path.resolve(path.join(__dirname, '..', '..')));
-var relative = isInNodeModules ? '../..' : '.';
-rimrafSync(relative + '/build');
+var relative = isInNodeModules ? '../../..' : '..';
+if (process.argv[2] === '--debug-template') {
+  relative = '../template';
+}
+var packageJsonPath = path.join(__dirname, relative, 'package.json');
+var buildPath = path.join(__dirname, relative, 'build');
+rimrafSync(buildPath);
 
 webpack(config).run(function(err, stats) {
   if (err) {
@@ -27,13 +32,28 @@ webpack(config).run(function(err, stats) {
   }
 
   var openCommand = process.platform === 'win32' ? 'start' : 'open';
+  var homepagePath = require(packageJsonPath).homepage;
   console.log('Successfully generated a bundle in the build folder!');
-  console.log();
-  console.log('You can now serve it with any static server, for example:');
-  console.log('  cd build');
-  console.log('  npm install -g http-server');
-  console.log('  hs');
-  console.log('  ' + openCommand + ' http://localhost:8080');
-  console.log();
+  if (homepagePath) {
+    console.log('You can now deploy it to ' + homepagePath + '.');
+    console.log('For example, if you use GitHub Pages:');
+    console.log();
+    console.log('  git checkout -B gh-pages');
+    console.log('  git add -f build');
+    console.log('  git commit -am "Rebuild website"');
+    console.log('  git push origin :gh-pages');
+    console.log('  git subtree push --prefix build origin gh-pages');
+    console.log('  git checkout -');
+    console.log();
+  } else {
+    console.log('You can now serve it with any static server.');
+    console.log('For example:');
+    console.log();
+    console.log('  cd build');
+    console.log('  npm install -g http-server');
+    console.log('  hs');
+    console.log('  ' + openCommand + ' http://localhost:8080');
+    console.log();
+  }
   console.log('The bundle is optimized and ready to be deployed to production.');
 });

scripts/eject.js

@@ -104,6 +104,11 @@ prompt('Are you sure you want to eject? This action is permanent. [y/N]', functi
   });
   delete hostPackage.scripts['eject'];
 
+  // explicitly specify ESLint config path for editor plugins
+  hostPackage.eslintConfig = {
+    extends: './config/eslint.js',
+  };
+
   console.log('Writing package.json');
   fs.writeFileSync(
     path.join(hostPath, 'package.json'),

scripts/init.js

@@ -29,6 +29,11 @@ module.exports = function(hostPath, appName, verbose) {
     hostPackage.scripts[command] = 'react-scripts ' + command;
   });
 
+  // explicitly specify ESLint config path for editor plugins
+  hostPackage.eslintConfig = {
+    extends: './node_modules/react-scripts/config/eslint.js',
+  };
+
   fs.writeFileSync(
     path.join(hostPath, 'package.json'),
     JSON.stringify(hostPackage, null, 2)
@@ -64,13 +69,14 @@ module.exports = function(hostPath, appName, verbose) {
     }
 
     console.log('Success! Created ' + appName + ' at ' + hostPath + '.');
-    console.log();
     console.log('Inside that directory, you can run several commands:');
+    console.log();
     console.log('  * npm start: Starts the development server.');
     console.log('  * npm run build: Bundles the app into static files for production.');
     console.log('  * npm run eject: Removes this tool. If you do this, you can’t go back!');
     console.log();
     console.log('We suggest that you begin by typing:');
+    console.log();
     console.log('  cd', cdpath);
     console.log('  npm start');
     console.log();

template/README.md

@@ -219,7 +219,7 @@ Please be advised that this is also a custom feature of Webpack.
 
 **It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images). However it may not be portable to some other environments, such as Node.js and Browserify. If you prefer to reference static assets in a more traditional way outside the module system, please let us know [in this issue](https://github.com/facebookincubator/create-react-app/issues/28), and we will consider support for this.
 
-### Adding Flow
+### Add Flow
 
 Flow typing is currently [not supported out of the box](https://github.com/facebookincubator/create-react-app/issues/72) with the default `.flowconfig` generated by Flow. If you run it, you might get errors like this:
 
@@ -275,6 +275,32 @@ module.name_mapper='^\(.*\)\.\(jpg\|png\|gif\|eot\|svg\|ttf\|woff\|woff2\|mp4\|w
 
 We will consider integrating more tightly with Flow in the future so that you don’t have to do this.
 
+### Deploy to GitHub Pages
+
+First, open your `package.json` and add a `homepage` field.
+It could look like this:
+
+```js
+{
+  "name": "my-app",
+  "homepage": "http://myusername.github.io/my-app",
+  // ...
+}
+```
+
+Now, whenever you run `npm run build`, you will see a cheat sheet with a sequence of commands to deploy to GitHub pages:
+
+```sh
+git checkout -B gh-pages
+git add -f build
+git commit -am "Rebuild website"
+git push origin :gh-pages
+git subtree push --prefix build origin gh-pages
+git checkout -
+```
+
+You may copy and paste them, or put them into a custom shell script. You may also customize them for another hosting provider.
+
 ### Something Missing?
 
 If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/template/README.md)

template/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "my-app",
+  "version": "0.0.1",
+  "private": true,
+  "devDependencies": {
+    "react-scripts": "0.1.0"
+  },
+  "dependencies": {
+    "react": "^15.2.1",
+    "react-dom": "^15.2.1"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "eject": "react-scripts eject"
+  }
+}