Bem

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",

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"
   },

packages/react-scripts/babelrc → packages/bem-react-scripts/babelrc

@@ -1,3 +1,3 @@
 {
   "presets": ["react-app"]
-}
+}

packages/react-scripts/bin/react-scripts.js → 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;
 }

packages/react-scripts/config/jest/babelTransform.js → 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,
 });

packages/react-scripts/config/paths.js → 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('.'),

packages/react-scripts/config/webpack.config.dev.js → 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 <style> tags.

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

@@ -97,7 +97,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,