From fa85f030de6843667202f912de841c276275df00 Mon Sep 17 00:00:00 2001
From: Kai Hao <kevin830726@gmail.com>
Date: Sun, 12 Jan 2020 20:07:07 +0800
Subject: [PATCH] Support shorthand scoped templates (#8298)

---
 docusaurus/docs/custom-templates.md         |  2 ++
 packages/create-react-app/createReactApp.js | 23 +++++++++++++++++----
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/docusaurus/docs/custom-templates.md b/docusaurus/docs/custom-templates.md
index 98acb9b1a75..7c43de98ccd 100644
--- a/docusaurus/docs/custom-templates.md
+++ b/docusaurus/docs/custom-templates.md
@@ -9,6 +9,8 @@ Custom Templates enable you to select a template to create your project from, wh
 
 You'll notice that Custom Templates are always named in the format `cra-template-[template-name]`, however you only need to provide the `[template-name]` to the creation command.
 
+Scoped templates are also supported, under the name `@[scope-name]/cra-template` or `@[scope-name]/cra-template-[template-name]`, which can be installed via `@[scope]` and `@[scope]/[template-name]` respectively.
+
 ### npm
 
 ```sh
diff --git a/packages/create-react-app/createReactApp.js b/packages/create-react-app/createReactApp.js
index bd60bed0d76..4d39b208767 100755
--- a/packages/create-react-app/createReactApp.js
+++ b/packages/create-react-app/createReactApp.js
@@ -640,10 +640,25 @@ function getTemplateInstallPackage(template, originalDirectory) {
       const scope = packageMatch[1] || '';
       const templateName = packageMatch[2];
 
-      const name = templateName.startsWith(templateToInstall)
-        ? templateName
-        : `${templateToInstall}-${templateName}`;
-      templateToInstall = `${scope}${name}`;
+      if (
+        templateName === templateToInstall ||
+        templateName.startsWith(`${templateToInstall}-`)
+      ) {
+        // Covers:
+        // - cra-template
+        // - @SCOPE/cra-template
+        // - cra-template-NAME
+        // - @SCOPE/cra-template-NAME
+        templateToInstall = `${scope}${templateName}`;
+      } else if (templateName.startsWith('@')) {
+        // Covers using @SCOPE only
+        templateToInstall = `${templateName}/${templateToInstall}`;
+      } else {
+        // Covers templates without the `cra-template` prefix:
+        // - NAME
+        // - @SCOPE/NAME
+        templateToInstall = `${scope}${templateToInstall}-${templateName}`;
+      }
     }
   }