diff --git a/lerna.json b/lerna.json index e2429777df..bcbd69d0f7 100644 --- a/lerna.json +++ b/lerna.json @@ -2,7 +2,7 @@ "lerna": "2.0.0-beta.38", "version": "independent", "changelog": { - "repo": "facebookincubator/create-react-app", + "repo": "awinogradov/create-bem-react-app", "labels": { "tag: new feature": ":rocket: New Feature", "tag: breaking change": ":boom: Breaking Change", diff --git a/package.json b/package.json index 9ca7cfc03d..6c3d13ced3 100644 --- a/package.json +++ b/package.json @@ -1,14 +1,14 @@ { "private": true, "scripts": { - "build": "node packages/react-scripts/scripts/build.js", + "build": "node packages/bem-react-scripts/scripts/build.js", "changelog": "lerna-changelog", - "create-react-app": "tasks/cra.sh", + "create-bem-react-app": "tasks/cra.sh", "e2e": "tasks/e2e-simple.sh", "postinstall": "lerna bootstrap", "publish": "tasks/release.sh", - "start": "node packages/react-scripts/scripts/start.js", - "test": "node packages/react-scripts/scripts/test.js --env=jsdom", + "start": "node packages/bem-react-scripts/scripts/start.js", + "test": "node packages/bem-react-scripts/scripts/test.js --env=jsdom", "format": "prettier --trailing-comma es5 --single-quote --write 'packages/*/*.js' 'packages/*/!(node_modules)/**/*.js'", "precommit": "lint-staged" }, diff --git a/packages/babel-preset-react-app/README.md b/packages/babel-preset-react-app/README.md deleted file mode 100644 index 4dc9fb9b16..0000000000 --- a/packages/babel-preset-react-app/README.md +++ /dev/null @@ -1,27 +0,0 @@ -# babel-preset-react-app - -This package includes the Babel preset used by [Create React App](https://github.com/facebookincubator/create-react-app).
-Please refer to its documentation: - -* [Getting Started](https://github.com/facebookincubator/create-react-app/blob/master/README.md#getting-started) – How to create a new app. -* [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App. - -## Usage in Create React App Projects - -The easiest way to use this configuration is with [Create React App](https://github.com/facebookincubator/create-react-app), which includes it by default. **You don’t need to install it separately in Create React App projects.** - -## Usage Outside of Create React App - -If you want to use this Babel preset in a project not built with Create React App, you can install it with following steps. - -First, [install Babel](https://babeljs.io/docs/setup/). - -Then create a file named `.babelrc` with following contents in the root folder of your project: - - ```js - { - "presets": ["react-app"] - } - ``` - -This preset uses the `useBuiltIns` option with [transform-object-rest-spread](http://babeljs.io/docs/plugins/transform-object-rest-spread/) and [transform-react-jsx](http://babeljs.io/docs/plugins/transform-react-jsx/), which assumes that `Object.assign` is available or polyfilled. diff --git a/packages/babel-preset-react-app/index.js b/packages/babel-preset-react-app/index.js deleted file mode 100644 index fbd421beb1..0000000000 --- a/packages/babel-preset-react-app/index.js +++ /dev/null @@ -1,143 +0,0 @@ -/** - * Copyright (c) 2015-present, Facebook, Inc. - * All rights reserved. - * - * This source code is licensed under the BSD-style license found in the - * LICENSE file in the root directory of this source tree. An additional grant - * of patent rights can be found in the PATENTS file in the same directory. - */ -'use strict'; - -var path = require('path'); - -const plugins = [ - // class { handleClick = () => { } } - require.resolve('babel-plugin-transform-class-properties'), - // The following two plugins use Object.assign directly, instead of Babel's - // extends helper. Note that this assumes `Object.assign` is available. - // { ...todo, completed: true } - [ - require.resolve('babel-plugin-transform-object-rest-spread'), - { - useBuiltIns: true, - }, - ], - // Transforms JSX - [ - require.resolve('babel-plugin-transform-react-jsx'), - { - useBuiltIns: true, - }, - ], - // Polyfills the runtime needed for async/await and generators - [ - require.resolve('babel-plugin-transform-runtime'), - { - helpers: false, - polyfill: false, - regenerator: true, - // Resolve the Babel runtime relative to the config. - moduleName: path.dirname(require.resolve('babel-runtime/package')), - }, - ], -]; - -// This is similar to how `env` works in Babel: -// https://babeljs.io/docs/usage/babelrc/#env-option -// We are not using `env` because it’s ignored in versions > babel-core@6.10.4: -// https://github.com/babel/babel/issues/4539 -// https://github.com/facebookincubator/create-react-app/issues/720 -// It’s also nice that we can enforce `NODE_ENV` being specified. -var env = process.env.BABEL_ENV || process.env.NODE_ENV; -if (env !== 'development' && env !== 'test' && env !== 'production') { - throw new Error( - 'Using `babel-preset-react-app` requires that you specify `NODE_ENV` or ' + - '`BABEL_ENV` environment variables. Valid values are "development", ' + - '"test", and "production". Instead, received: ' + - JSON.stringify(env) + - '.' - ); -} - -if (env === 'development' || env === 'test') { - // The following two plugins are currently necessary to make React warnings - // include more valuable information. They are included here because they are - // currently not enabled in babel-preset-react. See the below threads for more info: - // https://github.com/babel/babel/issues/4702 - // https://github.com/babel/babel/pull/3540#issuecomment-228673661 - // https://github.com/facebookincubator/create-react-app/issues/989 - plugins.push.apply(plugins, [ - // Adds component stack to warning messages - require.resolve('babel-plugin-transform-react-jsx-source'), - // Adds __self attribute to JSX which React will use for some warnings - require.resolve('babel-plugin-transform-react-jsx-self'), - ]); -} - -if (env === 'test') { - module.exports = { - presets: [ - // ES features necessary for user's Node version - [ - require('babel-preset-env').default, - { - targets: { - node: 'current', - }, - }, - ], - // JSX, Flow - require.resolve('babel-preset-react'), - ], - plugins: plugins.concat([ - // Compiles import() to a deferred require() - require.resolve('babel-plugin-dynamic-import-node'), - ]), - }; -} else { - module.exports = { - presets: [ - // Latest stable ECMAScript features - [ - require.resolve('babel-preset-env'), - { - targets: { - // React parses on ie 9, so we should too - ie: 9, - // We currently minify with uglify - // Remove after https://github.com/mishoo/UglifyJS2/issues/448 - uglify: true, - }, - // Disable polyfill transforms - useBuiltIns: false, - }, - ], - // JSX, Flow - require.resolve('babel-preset-react'), - ], - plugins: plugins.concat([ - // function* () { yield 42; yield 43; } - [ - require.resolve('babel-plugin-transform-regenerator'), - { - // Async functions are converted to generators by babel-preset-env - async: false, - }, - ], - // Adds syntax support for import() - require.resolve('babel-plugin-syntax-dynamic-import'), - ]), - }; - - if (env === 'production') { - // Optimization: hoist JSX that never changes out of render() - // Disabled because of issues: - // * https://github.com/facebookincubator/create-react-app/issues/525 - // * https://phabricator.babeljs.io/search/query/pCNlnC2xzwzx/ - // * https://github.com/babel/babel/issues/4516 - // TODO: Enable again when these issues are resolved. - // plugins.push.apply(plugins, [ - // require.resolve('babel-plugin-transform-react-constant-elements') - // ]); - } -} diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json deleted file mode 100644 index aa955e4376..0000000000 --- a/packages/babel-preset-react-app/package.json +++ /dev/null @@ -1,28 +0,0 @@ -{ - "name": "babel-preset-react-app", - "version": "2.1.1", - "description": "Babel preset used by Create React App", - "repository": "facebookincubator/create-react-app", - "license": "BSD-3-Clause", - "bugs": { - "url": "https://github.com/facebookincubator/create-react-app/issues" - }, - "files": [ - "index.js" - ], - "dependencies": { - "babel-plugin-dynamic-import-node": "1.0.0", - "babel-plugin-syntax-dynamic-import": "6.18.0", - "babel-plugin-transform-class-properties": "6.23.0", - "babel-plugin-transform-object-rest-spread": "6.23.0", - "babel-plugin-transform-react-constant-elements": "6.23.0", - "babel-plugin-transform-react-jsx": "6.23.0", - "babel-plugin-transform-react-jsx-self": "6.22.0", - "babel-plugin-transform-react-jsx-source": "6.22.0", - "babel-plugin-transform-regenerator": "6.22.0", - "babel-plugin-transform-runtime": "6.23.0", - "babel-preset-env": "1.2.1", - "babel-preset-react": "6.23.0", - "babel-runtime": "6.23.0" - } -} diff --git a/packages/react-scripts/.npmignore b/packages/bem-react-scripts/.npmignore similarity index 100% rename from packages/react-scripts/.npmignore rename to packages/bem-react-scripts/.npmignore diff --git a/packages/react-scripts/README.md b/packages/bem-react-scripts/README.md similarity index 100% rename from packages/react-scripts/README.md rename to packages/bem-react-scripts/README.md diff --git a/packages/react-scripts/babelrc b/packages/bem-react-scripts/babelrc similarity index 93% rename from packages/react-scripts/babelrc rename to packages/bem-react-scripts/babelrc index ad8e03a824..c14b2828d1 100644 --- a/packages/react-scripts/babelrc +++ b/packages/bem-react-scripts/babelrc @@ -1,3 +1,3 @@ { "presets": ["react-app"] -} \ No newline at end of file +} diff --git a/packages/react-scripts/bin/react-scripts.js b/packages/bem-react-scripts/bin/react-scripts.js similarity index 86% rename from packages/react-scripts/bin/react-scripts.js rename to packages/bem-react-scripts/bin/react-scripts.js index 8a1175c99e..0f2ad01a76 100755 --- a/packages/react-scripts/bin/react-scripts.js +++ b/packages/bem-react-scripts/bin/react-scripts.js @@ -44,9 +44,9 @@ switch (script) { break; default: console.log('Unknown script "' + script + '".'); - console.log('Perhaps you need to update react-scripts?'); + console.log('Perhaps you need to update bem-react-scripts?'); console.log( - 'See: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#updating-to-new-releases' + 'See: https://github.com/awinogradov/create-bem-react-app/blob/master/packages/bem-react-scripts/template/README.md#updating-to-new-releases' ); break; } diff --git a/packages/react-scripts/config/env.js b/packages/bem-react-scripts/config/env.js similarity index 100% rename from packages/react-scripts/config/env.js rename to packages/bem-react-scripts/config/env.js diff --git a/packages/react-scripts/config/jest/babelTransform.js b/packages/bem-react-scripts/config/jest/babelTransform.js similarity index 72% rename from packages/react-scripts/config/jest/babelTransform.js rename to packages/bem-react-scripts/config/jest/babelTransform.js index bee55b1b15..e619692f24 100644 --- a/packages/react-scripts/config/jest/babelTransform.js +++ b/packages/bem-react-scripts/config/jest/babelTransform.js @@ -12,5 +12,14 @@ const babelJest = require('babel-jest'); module.exports = babelJest.createTransformer({ presets: [require.resolve('babel-preset-react-app')], + plugins: [ + [ + require.resolve('babel-plugin-bem-import'), + { + levels: [`./src/common/`, `./src/desktop/`, `./src/touch/`], + techs: ['js'], + }, + ], + ], babelrc: false, }); diff --git a/packages/react-scripts/config/jest/cssTransform.js b/packages/bem-react-scripts/config/jest/cssTransform.js similarity index 100% rename from packages/react-scripts/config/jest/cssTransform.js rename to packages/bem-react-scripts/config/jest/cssTransform.js diff --git a/packages/react-scripts/config/jest/fileTransform.js b/packages/bem-react-scripts/config/jest/fileTransform.js similarity index 100% rename from packages/react-scripts/config/jest/fileTransform.js rename to packages/bem-react-scripts/config/jest/fileTransform.js diff --git a/packages/react-scripts/config/paths.js b/packages/bem-react-scripts/config/paths.js similarity index 97% rename from packages/react-scripts/config/paths.js rename to packages/bem-react-scripts/config/paths.js index 7639775604..e084dc5f2f 100644 --- a/packages/react-scripts/config/paths.js +++ b/packages/bem-react-scripts/config/paths.js @@ -93,7 +93,7 @@ function resolveOwn(relativePath) { return path.resolve(__dirname, '..', relativePath); } -// config before eject: we're in ./node_modules/react-scripts/config/ +// config before eject: we're in ./node_modules/bem-react-scripts/config/ module.exports = { appPath: resolveApp('.'), appBuild: resolveApp('build'), @@ -121,7 +121,7 @@ const reactScriptsLinked = fs.existsSync(reactScriptsPath) && // config before publish: we're in ./packages/react-scripts/config/ if ( !reactScriptsLinked && - __dirname.indexOf(path.join('packages', 'react-scripts', 'config')) !== -1 + __dirname.indexOf(path.join('packages', 'bem-react-scripts', 'config')) !== -1 ) { module.exports = { appPath: resolveApp('.'), diff --git a/packages/react-scripts/config/polyfills.js b/packages/bem-react-scripts/config/polyfills.js similarity index 100% rename from packages/react-scripts/config/polyfills.js rename to packages/bem-react-scripts/config/polyfills.js diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/bem-react-scripts/config/webpack.config.dev.js similarity index 90% rename from packages/react-scripts/config/webpack.config.dev.js rename to packages/bem-react-scripts/config/webpack.config.dev.js index c7948b66f6..999e033e57 100644 --- a/packages/react-scripts/config/webpack.config.dev.js +++ b/packages/bem-react-scripts/config/webpack.config.dev.js @@ -59,7 +59,8 @@ module.exports = { // We ship a few polyfills by default: require.resolve('./polyfills'), // Errors should be considered fatal in development - require.resolve('react-dev-utils/crashOverlay'), + // FIXME: in the next release of create-react-app + // require.resolve('react-dev-utils/crashOverlay'), // Finally, this is your app's code: paths.appIndexJs, // We include the app code last so that if there is a runtime error during @@ -98,7 +99,7 @@ module.exports = { }, // @remove-on-eject-begin // Resolve loaders (webpack plugins for CSS, images, transpilation) from the - // directory of `react-scripts` itself rather than the project directory. + // directory of `bem-react-scripts` itself rather than the project directory. resolveLoader: { modules: [ paths.ownNodeModules, @@ -130,6 +131,35 @@ module.exports = { ], include: paths.appSrc, }, + { + test: /\.(js|jsx)$/, + use: [ + { + loader: 'webpack-bem-loader', + options: { + levels: [`./src/common`, `./src/desktop`, `./src/touch`], + techs: ['js', 'css'], + }, + }, + { + loader: 'babel-loader', + options: { + // @remove-on-eject-begin + babelrc: false, + presets: [ + require.resolve('babel-preset-es2015'), + require.resolve('babel-preset-react-app'), + ], + // @remove-on-eject-end + // This is a feature of `babel-loader` for webpack (not Babel itself). + // It enables caching results in ./node_modules/.cache/babel-loader/ + // directory for faster rebuilds. + cacheDirectory: true, + }, + }, + ], + include: paths.appSrc, + }, // ** ADDING/UPDATING LOADERS ** // The "url" loader handles all assets unless explicitly excluded. // The `exclude` list *must* be updated with every change to loader extensions. @@ -166,22 +196,6 @@ module.exports = { name: 'static/media/[name].[hash:8].[ext]', }, }, - // Process JS with Babel. - { - test: /\.(js|jsx)$/, - include: paths.appSrc, - loader: 'babel-loader', - options: { - // @remove-on-eject-begin - babelrc: false, - presets: [require.resolve('babel-preset-react-app')], - // @remove-on-eject-end - // This is a feature of `babel-loader` for webpack (not Babel itself). - // It enables caching results in ./node_modules/.cache/babel-loader/ - // directory for faster rebuilds. - cacheDirectory: true, - }, - }, // "postcss" loader applies autoprefixer to our CSS. // "css" loader resolves paths in CSS and adds assets as dependencies. // "style" loader turns CSS into JS modules that inject