Don't assume the project is hosted at the root (#94)

* Don't assume the project is hosted at the root
* Require package.json in webpack.config.prod.js and use homepage if set; otherwise use '/'

* Fix package.json path and add sample package.json for tests

* Update publicPath to use relative path portion of URL defined in homepage

* Update successful bundle generation message

* Show bundle generation success message based on presence of homepage in package.json

Author: dhruska

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,8 @@ 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 : '/';
 
 module.exports = {
   bail: true,
@@ -35,9 +38,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

@@ -17,6 +17,9 @@ var config = require('../config/webpack.config.prod');
 var isInNodeModules = 'node_modules' ===
   path.basename(path.resolve(path.join(__dirname, '..', '..')));
 var relative = isInNodeModules ? '../..' : '.';
+if (process.argv[2] === '--debug-template') {
+  relative = './template';
+}
 rimrafSync(relative + '/build');
 
 webpack(config).run(function(err, stats) {
@@ -27,13 +30,18 @@ webpack(config).run(function(err, stats) {
   }
 
   var openCommand = process.platform === 'win32' ? 'start' : 'open';
+  var homepagePath = require(path.resolve(relative, 'package.json')).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');
+  if (homepagePath) {
+    console.log('You can now deploy and serve it from ' + homepagePath + '.');
+  } else {
+    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();
   console.log('The bundle is optimized and ready to be deployed to production.');
 });

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"
+  }
+}