From 19508381c2342131003bf1ad5cd2e598e7247938 Mon Sep 17 00:00:00 2001
From: iamdoron <iamdoron@users.noreply.github.com>
Date: Wed, 2 Aug 2017 05:50:58 +0300
Subject: [PATCH] Allow importing package.json (#2468)

* Allow importing package.json

* Remove package.json import from App.js template

* fix importing package.json

* Rename variable to reflect path is relative to root

* Check for both package & package.json in ModuleScopePlugin

* Use regex to check relative path to package.json

* Strictly enforce package.json extension on scope plugin

* Add allowedPaths to ModuleScopePlugin ctor and use it to allow app package.json

* Remove package.json import from App.js template

* Add package.json to react-scripts/template, show package version and name in the template

* Remove import package.json from template

* Remove template/package.json and its references in code

* Update ModuleScopePlugin.js

* Update README.md
---
 packages/react-dev-utils/ModuleScopePlugin.js  | 18 ++++++++++--------
 packages/react-dev-utils/README.md             |  4 ++--
 .../react-scripts/config/webpack.config.dev.js |  2 +-
 .../config/webpack.config.prod.js              |  2 +-
 4 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/react-dev-utils/ModuleScopePlugin.js b/packages/react-dev-utils/ModuleScopePlugin.js
index f630a0279f5..3a10904d36b 100644
--- a/packages/react-dev-utils/ModuleScopePlugin.js
+++ b/packages/react-dev-utils/ModuleScopePlugin.js
@@ -13,8 +13,9 @@ const chalk = require('chalk');
 const path = require('path');
 
 class ModuleScopePlugin {
-  constructor(appSrc) {
+  constructor(appSrc, allowedFiles = []) {
     this.appSrc = appSrc;
+    this.allowedFiles = new Set(allowedFiles);
   }
 
   apply(resolver) {
@@ -40,15 +41,16 @@ class ModuleScopePlugin {
       if (relative.startsWith('../') || relative.startsWith('..\\')) {
         return callback();
       }
-      // Find path from src to the requested file
-      const requestRelative = path.relative(
-        appSrc,
-        path.resolve(
-          path.dirname(request.context.issuer),
-          request.__innerRequest_request
-        )
+      const requestFullPath = path.resolve(
+        path.dirname(request.context.issuer),
+        request.__innerRequest_request
       );
+      if (this.allowedFiles.has(requestFullPath)) {
+        return callback();
+      }
+      // Find path from src to the requested file
       // Error if in a parent directory of src/
+      const requestRelative = path.relative(appSrc, requestFullPath);
       if (
         requestRelative.startsWith('../') ||
         requestRelative.startsWith('..\\')
diff --git a/packages/react-dev-utils/README.md b/packages/react-dev-utils/README.md
index 9206f3e8c9f..e23f0a294aa 100644
--- a/packages/react-dev-utils/README.md
+++ b/packages/react-dev-utils/README.md
@@ -57,7 +57,7 @@ module.exports = {
 ```
 
 
-#### `new ModuleScopePlugin(appSrc: string)`
+#### `new ModuleScopePlugin(appSrc: string, allowedFiles?: string[])`
 
 This Webpack plugin ensures that relative imports from app's source directory don't reach outside of it.
 
@@ -71,7 +71,7 @@ module.exports = {
   resolve: {
     // ...
     plugins: [
-      new ModuleScopePlugin(paths.appSrc),
+      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
       // ...
     ],
     // ...
diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js
index faac4ce058c..19b0c18dc19 100644
--- a/packages/react-scripts/config/webpack.config.dev.js
+++ b/packages/react-scripts/config/webpack.config.dev.js
@@ -129,7 +129,7 @@ module.exports = {
       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
       // please link the files into your node_modules/ and let module-resolution kick in.
       // Make sure your source files are compiled, as they will not be processed in any way.
-      new ModuleScopePlugin(paths.appSrc),
+      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
     ],
   },
   module: {
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index 85cf15982c3..1b6146d6f17 100644
--- a/packages/react-scripts/config/webpack.config.prod.js
+++ b/packages/react-scripts/config/webpack.config.prod.js
@@ -129,7 +129,7 @@ module.exports = {
       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
       // please link the files into your node_modules/ and let module-resolution kick in.
       // Make sure your source files are compiled, as they will not be processed in any way.
-      new ModuleScopePlugin(paths.appSrc),
+      new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
     ],
   },
   module: {