Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modularise scripts #1433

Merged
merged 8 commits into from
Mar 4, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/react-scripts/config/jest/babelTransform.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// @remove-file-on-eject
/**
* Copyright (c) 2014-present, Facebook, Inc. All rights reserved.
*
Expand Down
51 changes: 51 additions & 0 deletions packages/react-scripts/config/webpackDevServer.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
var config = require('./webpack.config.dev');
var paths = require('./paths');

var protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
var host = process.env.HOST || 'localhost';

module.exports = {
// Enable gzip compression of generated files.
compress: true,
// Silence WebpackDevServer's own logs since they're generally not useful.
// It will still show compile warnings and errors with this setting.
clientLogLevel: 'none',
// By default WebpackDevServer serves physical files from current directory
// in addition to all the virtual build products that it serves from memory.
// This is confusing because those files won’t automatically be available in
// production build folder unless we copy them. However, copying the whole
// project directory is dangerous because we may expose sensitive files.
// Instead, we establish a convention that only files in `public` directory
// get served. Our build script will copy `public` into the `build` folder.
// In `index.html`, you can get URL of `public` folder with %PUBLIC_URL%:
// <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
// In JavaScript code, you can access it with `process.env.PUBLIC_URL`.
// Note that we only recommend to use `public` folder as an escape hatch
// for files like `favicon.ico`, `manifest.json`, and libraries that are
// for some reason broken when imported through Webpack. If you just want to
// use an image, put it in `src` and `import` it from JavaScript instead.
contentBase: paths.appPublic,
// By default files from `contentBase` will not trigger a page reload.
watchContentBase: true,
// Enable hot reloading server. It will provide /sockjs-node/ endpoint
// for the WebpackDevServer client so it can learn when the files were
// updated. The WebpackDevServer client is included as an entry point
// in the Webpack development configuration. Note that only changes
// to CSS are currently hot reloaded. JS changes will refresh the browser.
hot: true,
// It is important to tell WebpackDevServer to use the same "root" path
// as we specified in the config. In development, we always serve from /.
publicPath: config.output.publicPath,
// WebpackDevServer is noisy by default so we emit custom message instead
// by listening to the compiler events with `compiler.plugin` calls above.
quiet: true,
// Reportedly, this avoids CPU overload on some systems.
// https://github.com/facebookincubator/create-react-app/issues/293
watchOptions: {
ignored: /node_modules/
},
// Enable HTTPS if the HTTPS environment variable is set to 'true'
https: protocol === 'https',
host: host,
overlay: false,
};
54 changes: 30 additions & 24 deletions packages/react-scripts/scripts/eject.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// @remove-file-on-eject
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
Expand All @@ -7,13 +8,14 @@
* of patent rights can be found in the PATENTS file in the same directory.
*/

var createJestConfig = require('../utils/createJestConfig');
var fs = require('fs-extra');
var path = require('path');
var paths = require('../config/paths');
var prompt = require('react-dev-utils/prompt');
var spawnSync = require('cross-spawn').sync;
var chalk = require('chalk');
var prompt = require('react-dev-utils/prompt');
var paths = require('../config/paths');
var createJestConfig = require('./utils/createJestConfig');

var green = chalk.green;
var cyan = chalk.cyan;

Expand Down Expand Up @@ -45,44 +47,48 @@ prompt(

var folders = [
'config',
path.join('config', 'jest'),
'scripts'
'config/jest',
'scripts',
'scripts/utils',
];

var files = [
path.join('config', 'env.js'),
path.join('config', 'paths.js'),
path.join('config', 'polyfills.js'),
path.join('config', 'webpack.config.dev.js'),
path.join('config', 'webpack.config.prod.js'),
path.join('config', 'jest', 'cssTransform.js'),
path.join('config', 'jest', 'fileTransform.js'),
path.join('scripts', 'build.js'),
path.join('scripts', 'start.js'),
path.join('scripts', 'test.js')
];
// Make shallow array of files paths
var files = folders.reduce(function (files, folder) {
Copy link
Contributor

@tuchk4 tuchk4 Mar 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Timer btw. Is there is any code convention (besides of eslint)? Use normal function or arrow?
Right now there are both normal and arrow are using. For example - eject.js.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We used to have a lower node requirement than Node 4, iirc. I'm not sure on an official preference.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Arrows are fine. If it runs on Node 4 then it's good. But only in react-scripts.

Global CLI should stay parseable by Node 0.12 so that we can show a nice error message instead of crashing. (We could also split modern code into a lazy require.)

return files.concat(
fs.readdirSync(path.join(ownPath, folder))
// set full path
.map(file => path.join(ownPath, folder, file))
// omit dirs from file list
.filter(file => fs.lstatSync(file).isFile())
);
}, []);

// Ensure that the app folder is clean and we won't override any files
folders.forEach(verifyAbsent);
files.forEach(verifyAbsent);

// Copy the files over
console.log();
console.log(cyan('Copying files into ' + appPath));

folders.forEach(function(folder) {
fs.mkdirSync(path.join(appPath, folder))
});

console.log();
console.log(cyan('Copying files into ' + appPath));
files.forEach(function(file) {
console.log(' Adding ' + cyan(file) + ' to the project');
var content = fs
.readFileSync(path.join(ownPath, file), 'utf8')
var content = fs.readFileSync(file, 'utf8');

// Skip flagged files
if (content.match(/\/\/ @remove-file-on-eject/)) {
return;
}
content = content
// Remove dead code from .js files on eject
.replace(/\/\/ @remove-on-eject-begin([\s\S]*?)\/\/ @remove-on-eject-end/mg, '')
// Remove dead code from .applescript files on eject
.replace(/-- @remove-on-eject-begin([\s\S]*?)-- @remove-on-eject-end/mg, '')
.trim() + '\n';
fs.writeFileSync(path.join(appPath, file), content);
console.log(' Adding ' + cyan(file.replace(ownPath, '')) + ' to the project');
fs.writeFileSync(file.replace(ownPath, appPath), content);
});
console.log();

Expand Down
1 change: 1 addition & 0 deletions packages/react-scripts/scripts/init.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// @remove-file-on-eject
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
Expand Down
Loading