react-scripts/webpack.config.prod.js:L539 reuse var useTypeScript

packages/react-scripts/README.md

@@ -1,7 +1,25 @@
-# react-scripts
+# byted-react-scripts
 
-This package includes scripts and configuration used by [Create React App](https://github.com/facebook/create-react-app).<br>
+__usage:__
+
+```sh
+create-react-app <project-dir> --scripts-version=byted-react-scripts
+```
+
+
+
+This package includes scripts and configuration forked from [Create React App](https://github.com/facebook/create-react-app).<br>
 Please refer to its documentation:
 
-- [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
-- [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
+* [Getting Started](https://github.com/facebook/create-react-app/blob/master/README.md#getting-started) – How to create a new app.
+* [User Guide](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md) – How to develop apps bootstrapped with Create React App.
+
+## .env config
+ - REACT_APP_REM_UNIT={number}
+    use px2rem
+
+- REACT_APP_HTML_INJECT
+
+  default: true
+
+  inject webpack assets into HTML template

packages/react-scripts/config/env.js

@@ -30,7 +30,7 @@ var dotenvFiles = [
   // since normally you expect tests to produce the same
   // results for everyone
   NODE_ENV !== 'test' && `${paths.dotenv}.local`,
-  paths.dotenv,
+  paths.dotenv
 ].filter(Boolean);
 
 // Load environment variables from .env* files. Suppress warnings using silent
@@ -42,7 +42,7 @@ dotenvFiles.forEach(dotenvFile => {
   if (fs.existsSync(dotenvFile)) {
     require('dotenv-expand')(
       require('dotenv').config({
-        path: dotenvFile,
+        path: dotenvFile
       })
     );
   }
@@ -84,15 +84,15 @@ function getClientEnvironment(publicUrl) {
         // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
         // This should only be used as an escape hatch. Normally you would put
         // images into the `src` and `import` them in code to get their paths.
-        PUBLIC_URL: publicUrl,
+        PUBLIC_URL: publicUrl
       }
     );
   // Stringify all values so we can feed into Webpack DefinePlugin
   const stringified = {
     'process.env': Object.keys(raw).reduce((env, key) => {
       env[key] = JSON.stringify(raw[key]);
       return env;
-    }, {}),
+    }, {})
   };
 
   return { raw, stringified };

packages/react-scripts/config/getWebpackInjectOption.js

@@ -0,0 +1,12 @@
+'use strict';
+module.exports = function getHtmlWebpackPluginInjectOption(env) {
+  const v = env.raw.REACT_APP_HTML_INJECT;
+  switch (true) {
+    case v === 'head' || v === 'body':
+      return v;
+    case v === 'false':
+      return false;
+    default:
+      return true;
+  }
+};

packages/react-scripts/config/jest/babelTransform.js

@@ -12,5 +12,5 @@ const babelJest = require('babel-jest');
 module.exports = babelJest.createTransformer({
   presets: [require.resolve('babel-preset-react-app')],
   babelrc: false,
-  configFile: false,
+  configFile: false
 });

packages/react-scripts/config/jest/cssTransform.js

@@ -18,5 +18,5 @@ module.exports = {
   getCacheKey() {
     // The output is always the same.
     return 'cssTransform';
-  },
+  }
 };

packages/react-scripts/config/jest/fileTransform.js

@@ -34,5 +34,5 @@ module.exports = {
     }
 
     return `module.exports = ${assetFilename};`;
-  },
+  }
 };

packages/react-scripts/config/jest/graphqlTransform.js

@@ -0,0 +1,18 @@
+// @remove-on-eject-begin
+/**
+ * Copyright (c) 2018-present, Facebook, Inc.
+ * Copyright (c) 2016 Remind
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+// @remove-on-eject-end
+'use strict';
+
+const loader = require('graphql-tag/loader');
+
+module.exports = {
+  process(src) {
+    return loader.call({ cacheable() {} }, src);
+  },
+};

packages/react-scripts/config/jest/typescriptTransform.js

@@ -0,0 +1,7 @@
+// Copyright 2004-present Facebook. All Rights Reserved.
+
+'use strict';
+
+const tsJest = require('ts-jest');
+
+module.exports = tsJest;

packages/react-scripts/config/paths.js

@@ -57,7 +57,7 @@ const moduleFileExtensions = [
   'tsx',
   'json',
   'web.jsx',
-  'jsx',
+  'jsx'
 ];
 
 // Resolve file paths in the same order as webpack
@@ -81,15 +81,19 @@ module.exports = {
   appPublic: resolveApp('public'),
   appHtml: resolveApp('public/index.html'),
   appIndexJs: resolveModule(resolveApp, 'src/index'),
+  appIndexJsSSR: resolveModule(resolveApp, 'src/ssr'),
   appPackageJson: resolveApp('package.json'),
   appSrc: resolveApp('src'),
   appTsConfig: resolveApp('tsconfig.json'),
+  appTsProdConfig: resolveApp('tsconfig.prod.json'),
+  appTsSSRConfig: resolveApp('tsconfig.ssr.json'),
+  appTsLint: resolveApp('tslint.json'),
   yarnLockFile: resolveApp('yarn.lock'),
   testsSetup: resolveModule(resolveApp, 'src/setupTests'),
   proxySetup: resolveApp('src/setupProxy.js'),
   appNodeModules: resolveApp('node_modules'),
   publicUrl: getPublicUrl(resolveApp('package.json')),
-  servedPath: getServedPath(resolveApp('package.json')),
+  servedPath: getServedPath(resolveApp('package.json'))
 };
 
 // @remove-on-eject-begin
@@ -103,9 +107,14 @@ module.exports = {
   appPublic: resolveApp('public'),
   appHtml: resolveApp('public/index.html'),
   appIndexJs: resolveModule(resolveApp, 'src/index'),
+  appIndexJsSSR: resolveModule(resolveApp, 'src/ssr'),
   appPackageJson: resolveApp('package.json'),
   appSrc: resolveApp('src'),
   appTsConfig: resolveApp('tsconfig.json'),
+  appTsTestConfig: resolveApp('tsconfig.test.json'),
+  appTsProdConfig: resolveApp('tsconfig.prod.json'),
+  appTsSSRConfig: resolveApp('tsconfig.ssr.json'),
+  appTsLint: resolveApp('tslint.json'),
   yarnLockFile: resolveApp('yarn.lock'),
   testsSetup: resolveModule(resolveApp, 'src/setupTests'),
   proxySetup: resolveApp('src/setupProxy.js'),
@@ -137,13 +146,19 @@ if (
     appPublic: resolveOwn('template/public'),
     appHtml: resolveOwn('template/public/index.html'),
     appIndexJs: resolveModule(resolveOwn, 'template/src/index'),
+    appIndexJsSSR: resolveModule(resolveOwn, 'template/src/ssr'),
     appPackageJson: resolveOwn('package.json'),
     appSrc: resolveOwn('template/src'),
     appTsConfig: resolveOwn('template/tsconfig.json'),
     yarnLockFile: resolveOwn('template/yarn.lock'),
     testsSetup: resolveModule(resolveOwn, 'template/src/setupTests'),
     proxySetup: resolveOwn('template/src/setupProxy.js'),
     appNodeModules: resolveOwn('node_modules'),
+    appTsConfig: resolveOwn('template/tsconfig.json'),
+    appTsProdConfig: resolveOwn('template/tsconfig.prod.json'),
+    appTsLint: resolveOwn('template/tslint.json'),
+    appTsTestConfig: resolveOwn('template/tsconfig.test.json'),
+    appTsSSRConfig: resolveOwn('template/tsconfig.ssr.json'),
     publicUrl: getPublicUrl(resolveOwn('package.json')),
     servedPath: getServedPath(resolveOwn('package.json')),
     // These properties only exist before ejecting:

packages/react-scripts/config/ssr/DevRebuildPlugin.js

@@ -0,0 +1,52 @@
+/* eslint-disable */
+const fork = require('child_process').fork;
+const path = require('path');
+const paths = require('../paths');
+const fs = require('fs');
+
+module.exports = class SSRDevRebuilder {
+  apply(compiler) {
+    compiler.plugin('emit', (compilation, callback) => {
+      // var changedFiles = Object.keys(
+      //   compilation.fileTimestamps
+      // ).filter(watchfile => {
+      //   return (
+      //     (this.prevTimestamps[watchfile] || this.startTime) <
+      //     (compilation.fileTimestamps[watchfile] || Infinity)
+      //   );
+      // });
+
+      let ssrDefer = { resolve: null, reject: null, promise: null };
+      ssrDefer.promise = new Promise((r, j) => {
+        ssrDefer.resolve = r;
+        ssrDefer.reject = j;
+      });
+
+      if (fs.existsSync(paths.appIndexJsSSR)) {
+        console.log('Creating ssr bundle...');
+        const ssrCP = fork(
+          path.resolve(__dirname, '../webpack.config.ssr'),
+          [],
+          {
+            stdio: 'inherit',
+            env: process.env
+          }
+        );
+
+        ssrCP.once('error', err => {
+          console.log(err);
+          ssrDefer.resolve();
+          ssrCP.removeAllListeners('exit');
+        });
+        ssrCP.once('exit', () => {
+          ssrDefer.resolve();
+        });
+      } else {
+        ssrDefer.resolve();
+      }
+
+      this.prevTimestamps = compilation.fileTimestamps;
+      ssrDefer.promise.then(callback);
+    });
+  }
+};

packages/react-scripts/config/ssr/style-loader.js

@@ -0,0 +1,4 @@
+/* eslint-disable */
+module.exports = function(_source, _map) {
+  return 'export default "";';
+};