Fix- react-scripts build doesn't allow for specified path

README.md

@@ -90,6 +90,17 @@ By default, runs tests related to files changes since the last commit.
 ### `npm run build`
 
 Builds the app for production to the `build` folder.<br>
+Now you can also specify the build path using following ways:
+
+1. npm run build --buildPath=specify_full_path
+2. Inside package.json add config as bellow
+```
+"config" : {
+  "buildPath": "specify_full_path"
+ }
+```
+*Note: Priority 1st, 2nd and default*
+
 It correctly bundles React in production mode and optimizes the build for the best performance.
 
 The build is minified and the filenames include the hashes.<br>

packages/react-scripts/config/webpack.config.prod.js

@@ -18,6 +18,7 @@ var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var url = require('url');
 var paths = require('./paths');
 var getClientEnvironment = require('./env');
+var buildPath = process.env.npm_config_buildPath || process.env.npm_package_config_buildPath || paths.appBuild;
 
 // @remove-on-eject-begin
 // `path` is not used after eject - see https://github.com/facebookincubator/create-react-app/issues/1174
@@ -74,7 +75,7 @@ module.exports = {
   ],
   output: {
     // The build folder.
-    path: paths.appBuild,
+    path: buildPath,
     // Generated JS file names (with nested folders).
     // There will be one main bundle, and one file per asynchronous chunk.
     // We don't currently advertise code splitting but Webpack supports it.

packages/react-scripts/scripts/build.js

@@ -29,6 +29,7 @@ var paths = require('../config/paths');
 var checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 var recursive = require('recursive-readdir');
 var stripAnsi = require('strip-ansi');
+var buildPath = process.env.npm_config_buildPath || process.env.npm_package_config_buildPath || paths.appBuild;
 
 var useYarn = fs.existsSync(paths.yarnLockFile);
 
@@ -41,7 +42,7 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 // Output: /static/js/main.js
 function removeFileNameHash(fileName) {
   return fileName
-    .replace(paths.appBuild, '')
+    .replace(buildPath, '')
     .replace(/\/?(.*)(\.\w+)(\.js|\.css)/, (match, p1, p2, p3) => p1 + p3);
 }
 
@@ -64,7 +65,7 @@ function getDifferenceLabel(currentSize, previousSize) {
 
 // First, read the current file sizes in build directory.
 // This lets us display how much they changed later.
-recursive(paths.appBuild, (err, fileNames) => {
+recursive(buildPath, (err, fileNames) => {
   var previousSizeMap = (fileNames || [])
     .filter(fileName => /\.(js|css)$/.test(fileName))
     .reduce((memo, fileName) => {
@@ -76,7 +77,7 @@ recursive(paths.appBuild, (err, fileNames) => {
 
   // Remove all content but keep the directory so that
   // if you're in it, you don't end up in Trash
-  fs.emptyDirSync(paths.appBuild);
+  fs.emptyDirSync(buildPath);
 
   // Start the webpack build
   build(previousSizeMap);
@@ -90,12 +91,12 @@ function printFileSizes(stats, previousSizeMap) {
   var assets = stats.toJson().assets
     .filter(asset => /\.(js|css)$/.test(asset.name))
     .map(asset => {
-      var fileContents = fs.readFileSync(paths.appBuild + '/' + asset.name);
+      var fileContents = fs.readFileSync(buildPath + '/' + asset.name);
       var size = gzipSize(fileContents);
       var previousSize = previousSizeMap[removeFileNameHash(asset.name)];
       var difference = getDifferenceLabel(size, previousSize);
       return {
-        folder: path.join('build', path.dirname(asset.name)),
+        folder: path.join(buildPath, path.dirname(asset.name)),
         name: path.basename(asset.name),
         size: size,
         sizeLabel: filesize(size) + (difference ? ' (' + difference + ')' : '')
@@ -228,7 +229,7 @@ function build(previousSizeMap) {
 }
 
 function copyPublicFolder() {
-  fs.copySync(paths.appPublic, paths.appBuild, {
+  fs.copySync(paths.appPublic, buildPath, {
     dereference: true,
     filter: file => file !== paths.appHtml
   });