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

Object proxy stub #1178

Closed
wants to merge 16 commits into from
8 changes: 6 additions & 2 deletions packages/react-scripts/.babelrc
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
{
"presets": ["react-app"]
}
"presets": [
"latest",
"react",
"stage-1"
]
}
8 changes: 7 additions & 1 deletion packages/react-scripts/config/jest/CSSStub.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,10 @@
*/
// @remove-on-eject-end

module.exports = {};
/*
* ZEAL: Stub style imports with identity proxy to allow testing of
* dynamic styles etc
*/
const idenityObjProxy = require('identity-obj-proxy');

module.exports = idenityObjProxy;
6 changes: 5 additions & 1 deletion packages/react-scripts/config/jest/transform.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,5 +9,9 @@
const babelJest = require('babel-jest');

module.exports = babelJest.createTransformer({
presets: [require.resolve('babel-preset-react-app')]
presets: [
require.resolve('babel-preset-latest'),
require.resolve('babel-preset-react'),
require.resolve('babel-preset-stage-1')
]
});
30 changes: 15 additions & 15 deletions packages/react-scripts/config/paths.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,12 +38,12 @@ var nodePaths = (process.env.NODE_PATH || '')
// config after eject: we're in ./config/
module.exports = {
appBuild: resolveApp('build'),
appPublic: resolveApp('public'),
appHtml: resolveApp('public/index.html'),
appIndexJs: resolveApp('src/index.js'),
appPublic: resolveApp('client/public'),
appHtml: resolveApp('client/public/index.html'),
appIndexJs: resolveApp('client/index.js'),
appPackageJson: resolveApp('package.json'),
appSrc: resolveApp('src'),
testsSetup: resolveApp('src/setupTests.js'),
appSrc: resolveApp('client'),
testsSetup: resolveApp('client/setupTests.js'),
appNodeModules: resolveApp('node_modules'),
ownNodeModules: resolveApp('node_modules'),
nodePaths: nodePaths
Expand All @@ -57,12 +57,12 @@ function resolveOwn(relativePath) {
// config before eject: we're in ./node_modules/react-scripts/config/
module.exports = {
appBuild: resolveApp('build'),
appPublic: resolveApp('public'),
appHtml: resolveApp('public/index.html'),
appIndexJs: resolveApp('src/index.js'),
appPublic: resolveApp('client/public'),
appHtml: resolveApp('client/public/index.html'),
appIndexJs: resolveApp('client/index.js'),
appPackageJson: resolveApp('package.json'),
appSrc: resolveApp('src'),
testsSetup: resolveApp('src/setupTests.js'),
appSrc: resolveApp('client'),
testsSetup: resolveApp('client/setupTests.js'),
appNodeModules: resolveApp('node_modules'),
// this is empty with npm3 but node resolution searches higher anyway:
ownNodeModules: resolveOwn('../node_modules'),
Expand All @@ -74,12 +74,12 @@ module.exports = {
if (__dirname.indexOf(path.join('packages', 'react-scripts', 'config')) !== -1) {
module.exports = {
appBuild: resolveOwn('../../../build'),
appPublic: resolveOwn('../template/public'),
appHtml: resolveOwn('../template/public/index.html'),
appIndexJs: resolveOwn('../template/src/index.js'),
appPublic: resolveOwn('../template/client/public'),
appHtml: resolveOwn('../template/client/public/index.html'),
appIndexJs: resolveOwn('../template/client/index.js'),
appPackageJson: resolveOwn('../package.json'),
appSrc: resolveOwn('../template/src'),
testsSetup: resolveOwn('../template/src/setupTests.js'),
appSrc: resolveOwn('../template/client'),
testsSetup: resolveOwn('../template/client/setupTests.js'),
appNodeModules: resolveOwn('../node_modules'),
ownNodeModules: resolveOwn('../node_modules'),
nodePaths: nodePaths
Expand Down
41 changes: 33 additions & 8 deletions packages/react-scripts/config/webpack.config.dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,14 @@ var paths = require('./paths');

// Webpack uses `publicPath` to determine where the app is being served from.
// In development, we always serve from the root. This makes config easier.
var publicPath = '/';
// ZEAL: Setting publicPath in the start script and passing it in. Since we are
// mounting this app on various backends, the dev server port will be different
// from the port on window location. Because of this, we need the full public
// path, not just the relative path. Elements of the full path can be dynamic,
// but are all known in the start script, making it the best place to define the
// public path.
// var publicPath = '/';

// `publicUrl` is just like `publicPath`, but we will provide it to our app
// as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
// Omit trailing slash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
Expand All @@ -33,7 +40,9 @@ var env = getClientEnvironment(publicUrl);
// This is the development configuration.
// It is focused on developer experience and fast rebuilds.
// The production configuration is different and lives in a separate file.
module.exports = {
// ZEAL: Converted to a function to allow injecting the publicPath.
module.exports = function(publicPath) {
return {
// This makes the bundle appear split into separate modules in the devtools.
// We don't use source maps here because they can be confusing:
// https://github.com/facebookincubator/create-react-app/issues/343#issuecomment-237241875
Expand All @@ -51,9 +60,12 @@ module.exports = {
// Note: instead of the default WebpackDevServer client, we use a custom one
// to bring better experience for Create React App users. You can replace
// the line below with these two lines if you prefer the stock client:
// require.resolve('webpack-dev-server/client') + '?/',
// require.resolve('webpack/hot/dev-server'),
require.resolve('react-dev-utils/webpackHotDevClient'),
// ZEAL: Opted to use the default client because the custom one gets the
// port off window location, which will be different from the dev server
// when the app is served from a different back end.
require.resolve('webpack-dev-server/client') + '?' + publicPath,
require.resolve('webpack/hot/dev-server'),
// require.resolve('react-dev-utils/webpackHotDevClient'),
// We ship a few polyfills by default:
require.resolve('./polyfills'),
// Finally, this is your app's code:
Expand Down Expand Up @@ -119,7 +131,11 @@ module.exports = {
query: {
// @remove-on-eject-begin
babelrc: false,
presets: [require.resolve('babel-preset-react-app')],
presets: [
require.resolve('babel-preset-latest'),
require.resolve('babel-preset-react'),
require.resolve('babel-preset-stage-1')
],
// @remove-on-eject-end
// This is a feature of `babel-loader` for webpack (not Babel itself).
// It enables caching results in ./node_modules/.cache/react-scripts/
Expand All @@ -135,9 +151,18 @@ module.exports = {
// "style" loader turns CSS into JS modules that inject <style> tags.
// In production, we use a plugin to extract that CSS to a file, but
// in development "style" loader enables hot editing of CSS.
// ZEAL: Add support for CSS Modules and SASS
{
test: /\.css$/,
loader: 'style!css?importLoaders=1!postcss'
loader: 'style!css?importLoaders=1&modules=1!postcss'
},
{
test: /\.scss$/,
loaders: [
'style',
'css?modules&importLoaders=1' +
'&localIdentName=[path][local]__[hash:base64:5]!sass'
]
},
// JSON is not enabled by default in Webpack but both Node and Browserify
// allow it implicitly so we also enable it.
Expand Down Expand Up @@ -221,4 +246,4 @@ module.exports = {
net: 'empty',
tls: 'empty'
}
};
}};
6 changes: 5 additions & 1 deletion packages/react-scripts/config/webpack.config.prod.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,11 @@ module.exports = {
// @remove-on-eject-begin
query: {
babelrc: false,
presets: [require.resolve('babel-preset-react-app')],
presets: [
require.resolve('babel-preset-latest'),
require.resolve('babel-preset-react'),
require.resolve('babel-preset-stage-1')
],
},
// @remove-on-eject-end
},
Expand Down
64 changes: 11 additions & 53 deletions packages/react-scripts/package.json
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
{
"name": "react-scripts",
"version": "0.7.0",
"name": "@zeal/react-scripts",
"version": "0.1.5",
"description": "Configuration and scripts for Create React App.",
"repository": "facebookincubator/create-react-app",
"repository": "codingzeal/create-react-app",
"license": "BSD-3-Clause",
"engines": {
"node": ">=4"
},
"bugs": {
"url": "https://github.com/facebookincubator/create-react-app/issues"
"url": "https://github.com/codingzeal/create-react-app/issues"
},
"files": [
".babelrc",
Expand All @@ -28,7 +28,9 @@
"babel-eslint": "7.0.0",
"babel-jest": "16.0.0",
"babel-loader": "6.2.5",
"babel-preset-react-app": "^1.0.0",
"babel-preset-latest": "^6.16.0",
"babel-preset-react": "^6.16.0",
"babel-preset-stage-1": "^6.16.0",
"case-sensitive-paths-webpack-plugin": "1.1.4",
"chalk": "1.1.3",
"connect-history-api-fallback": "1.3.0",
Expand All @@ -51,15 +53,18 @@
"gzip-size": "3.0.0",
"html-webpack-plugin": "2.24.0",
"http-proxy-middleware": "0.17.2",
"identity-obj-proxy": "^3.0.0",
"jest": "16.0.2",
"json-loader": "0.5.4",
"node-sass": "^3.13.0",
"object-assign": "4.1.0",
"path-exists": "2.1.0",
"postcss-loader": "1.0.0",
"promise": "7.1.1",
"react-dev-utils": "^0.3.0",
"recursive-readdir": "2.1.0",
"rimraf": "2.5.4",
"sass-loader": "^4.0.2",
"strip-ansi": "3.0.1",
"style-loader": "0.13.1",
"url-loader": "0.5.7",
Expand All @@ -69,57 +74,10 @@
"whatwg-fetch": "1.0.0"
},
"devDependencies": {
"bundle-deps": "1.0.0",
"react": "^15.3.0",
"react-dom": "^15.3.0"
},
"optionalDependencies": {
"fsevents": "1.0.14"
},
"bundledDependencies": [
"autoprefixer",
"babel-core",
"babel-eslint",
"babel-jest",
"babel-loader",
"babel-preset-react-app",
"case-sensitive-paths-webpack-plugin",
"chalk",
"connect-history-api-fallback",
"cross-spawn",
"css-loader",
"detect-port",
"dotenv",
"eslint",
"eslint-config-react-app",
"eslint-loader",
"eslint-plugin-flowtype",
"eslint-plugin-import",
"eslint-plugin-jsx-a11y",
"eslint-plugin-react",
"extract-text-webpack-plugin",
"file-loader",
"filesize",
"find-cache-dir",
"fs-extra",
"gzip-size",
"html-webpack-plugin",
"http-proxy-middleware",
"jest",
"json-loader",
"object-assign",
"path-exists",
"postcss-loader",
"promise",
"react-dev-utils",
"recursive-readdir",
"rimraf",
"strip-ansi",
"style-loader",
"url-loader",
"webpack",
"webpack-dev-server",
"webpack-manifest-plugin",
"whatwg-fetch"
]
}
}
14 changes: 10 additions & 4 deletions packages/react-scripts/scripts/start.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,9 @@ if (isSmokeTest) {
function setupCompiler(host, port, protocol) {
// "Compiler" is a low-level interface to Webpack.
// It lets us listen to some events and provide our own custom messages.
compiler = webpack(config, handleCompile);
// ZEAL: Injecting the publicPath into the config since it needs to be fully
// qualified now. More notes in the config regarding publicPath.
compiler = webpack(config(publicPath(host, port, protocol)), handleCompile);

// "invalid" event fires when you have changed a file, and Webpack is
// recompiling a bundle. WebpackDevServer takes care to pause serving the
Expand Down Expand Up @@ -221,7 +223,9 @@ function runDevServer(host, port, protocol) {
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,
// ZEAL: The public path is now being injected into the config with this
// function, so no need to reach into the config to get it anymore.
publicPath: publicPath(host, port, protocol),
// WebpackDevServer is noisy by default so we emit custom message instead
// by listening to the compiler events with `compiler.plugin` calls above.
quiet: true,
Expand All @@ -246,11 +250,13 @@ function runDevServer(host, port, protocol) {

clearConsole();
console.log(chalk.cyan('Starting the development server...'));
console.log();
openBrowser(protocol + '://' + host + ':' + port + '/');
});
}

function publicPath(host, port, protocol) {
return protocol + '://' + host + ':' + port + '/'
}

function run(port) {
var protocol = process.env.HTTPS === 'true' ? "https" : "http";
var host = process.env.HOST || 'localhost';
Expand Down
4 changes: 3 additions & 1 deletion tasks/cra.sh
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,9 @@ cp package.json package.json.orig

# Like bundle-deps, this script modifies packages/react-scripts/package.json,
# copying own dependencies (those in the `packages` dir) to bundledDependencies
node $root_path/tasks/bundle-own-deps.js
# ZEAL: Disabled because https://github.com/npm/npm/issues/12834, it will be
# removed soon: https://github.com/facebookincubator/create-react-app/pull/1068
# node $root_path/tasks/bundle-own-deps.js

# Finally, pack react-scripts
scripts_path=$root_path/packages/react-scripts/`npm pack`
Expand Down
4 changes: 3 additions & 1 deletion tasks/release.sh
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,9 @@ npm dedupe
rm -rf node_modules/fsevents

# This modifies package.json to copy all dependencies to bundledDependencies
node ./node_modules/.bin/bundle-deps
# ZEAL: Disabled because https://github.com/npm/npm/issues/12834, it will be
# removed soon: https://github.com/facebookincubator/create-react-app/pull/1068
# node ./node_modules/.bin/bundle-deps

cd $root_path
# Go!
Expand Down