Add template support

Author: mrmckeb

docusaurus/docs/adding-typescript.md

@@ -12,14 +12,16 @@ title: Adding TypeScript
 To start a new Create React App project with [TypeScript](https://www.typescriptlang.org/), you can run:
 
 ```sh
-npx create-react-app my-app --typescript
+npx create-react-app my-app --template typescript
 
 # or
 
-yarn create react-app my-app --typescript
+yarn create react-app my-app --template typescript
 ```
 
 > If you've previously installed `create-react-app` globally via `npm install -g create-react-app`, we recommend you uninstall the package using `npm uninstall -g create-react-app` to ensure that `npx` always uses the latest version.
+>
+> Global installs of `create-react-app` are no longer supported.
 
 To add [TypeScript](https://www.typescriptlang.org/) to a Create React App project, first install it:
 
@@ -49,5 +51,4 @@ If your project is not created with TypeScript enabled, npx may be using a cache
 
 If you are currently using [create-react-app-typescript](https://github.com/wmonk/create-react-app-typescript/), see [this blog post](https://vincenttunru.com/migrate-create-react-app-typescript-to-create-react-app/) for instructions on how to migrate to Create React App.
 
-
 Constant enums and namespaces are not supported, you can learn about the constraints of [using Babel with TypeScript here](https://babeljs.io/docs/en/babel-plugin-transform-typescript#caveats).

docusaurus/docs/getting-started.md

@@ -62,13 +62,33 @@ yarn create react-app my-app
 
 _`yarn create` is available in Yarn 0.25+_
 
-### Creating a TypeScript app
+### Selecting a template
 
-Follow our [Adding TypeScript](adding-typescript.md) documentation to create a TypeScript app.
+You can now optionally start a new app from a template by appending `--template [template-name]` to the creation command.
+
+If you don't select a template, we'll create your project with our base template.
+
+Templates are always named in the format `cra-template-[template-name]`, however you only need to provide the `[template-name]` to the creation command.
+
+```sh
+npx create-react-app my-app --template [template-name]
+```
+
+> You can find a a list of available templates by searching for ["cra-template-\*"](https://www.npmjs.com/search?q=cra-template-*) on npm.
+
+#### Creating a TypeScript app
+
+You can start a new TypeScript app using templates. To use our provided TypeScript template, append `--template typescript` to the creation command.
+
+```sh
+npx create-react-app my-app --template typescript
+```
+
+If you already have a project and would like to add TypeScript, see our [Adding TypeScript](adding-typescript.md) documentation.
 
 ### Selecting a package manager
 
-When you create a new app, the CLI will use [Yarn](https://yarnpkg.com/) to install dependencies (when available). If you have Yarn installed, but would prefer to use npm, you can append --use-npm to the creation command. For example:
+When you create a new app, the CLI will use [Yarn](https://yarnpkg.com/) to install dependencies (when available). If you have Yarn installed, but would prefer to use npm, you can append `--use-npm` to the creation command. For example:
 
 ```sh
 npx create-react-app my-app --use-npm

packages/cra-template-typescript/README.md

@@ -0,0 +1,20 @@
+# cra-template-typescript
+
+This is the official TypeScript template for [Create React App](https://github.com/facebook/create-react-app).
+
+To use this template, simply add `--template typescript` when creating a new app.
+
+For example:
+
+```sh
+npx create-react-app my-app --template typescript
+
+# or
+
+yarn create react-app my-app --template typescript
+```
+
+For more information, please refer to:
+
+- [Getting Started](https://create-react-app.dev/docs/getting-started) – How to create a new app.
+- [User Guide](https://create-react-app.dev) – How to develop apps bootstrapped with Create React App.

packages/cra-template-typescript/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "cra-template-typescript",
+  "version": "1.0.0",
+  "keywords": [
+    "react",
+    "create-react-app",
+    "template",
+    "typescript"
+  ],
+  "description": "The base TypeScript template for Create React App.",
+  "main": "template.json",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/facebook/create-react-app.git",
+    "directory": "packages/cra-template-typescript"
+  },
+  "license": "MIT",
+  "engines": {
+    "node": ">=8"
+  },
+  "bugs": {
+    "url": "https://github.com/facebook/create-react-app/issues"
+  },
+  "files": [
+    "template",
+    "template.json"
+  ]
+}

packages/cra-template-typescript/template.json

@@ -0,0 +1,9 @@
+{
+  "dependencies": {
+    "@types/node": "^12.0.0",
+    "@types/react": "^16.9.0",
+    "@types/react-dom": "^16.9.0",
+    "@types/jest": "^24.0.0",
+    "typescript": "^3.6.0"
+  }
+}

packages/react-scripts/template-typescript/README.md renamed to packages/cra-template-typescript/template/README.md

@@ -0,0 +1,10 @@
+# cra-template
+
+This is the official base template for [Create React App](https://github.com/facebook/create-react-app).
+
+If you don't specify a template (for example, `--template typescript`), this template will be used by default.
+
+For more information, please refer to:
+
+- [Getting Started](https://create-react-app.dev/docs/getting-started) – How to create a new app.
+- [User Guide](https://create-react-app.dev) – How to develop apps bootstrapped with Create React App.

packages/react-scripts/template-typescript/gitignore renamed to packages/cra-template-typescript/template/gitignore

@@ -0,0 +1,27 @@
+{
+  "name": "cra-template",
+  "version": "1.0.0",
+  "keywords": [
+    "react",
+    "create-react-app",
+    "template"
+  ],
+  "description": "The base template for Create React App.",
+  "main": "template.json",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/facebook/create-react-app.git",
+    "directory": "packages/cra-template"
+  },
+  "license": "MIT",
+  "engines": {
+    "node": ">=8"
+  },
+  "bugs": {
+    "url": "https://github.com/facebook/create-react-app/issues"
+  },
+  "files": [
+    "template",
+    "template.json"
+  ]
+}

packages/react-scripts/template-typescript/public/favicon.ico renamed to packages/cra-template-typescript/template/public/favicon.ico

@@ -0,0 +1,3 @@
+{
+    "dependencies": {}
+}

packages/react-scripts/template-typescript/public/index.html renamed to packages/cra-template-typescript/template/public/index.html

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}