diff --git a/README.md b/README.md index e9f8c1b6074..93f72e8842d 100644 --- a/README.md +++ b/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.
+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.
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 058db0d7921..3c5720cebbd 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/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. diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js index 42be50d43a8..45111f3a3cc 100644 --- a/packages/react-scripts/scripts/build.js +++ b/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 });