Add template support #7716

mrmckeb · 2019-09-22T12:43:24Z

This is an updated version of #6514.

TODO:

Revert .gitignore change, as this is likely to cause confusion in future.
Improve support for old and forked react-scripts packages.
Fix failing tests.
Add documentation for this feature.

mrmckeb · 2019-09-22T18:47:15Z

@ianschmitz @iansu This PR is working locally, but I have a handful of tests to fix.

It is ready for you to take a look at though, and you can test locally:

node ../create-react-app/packages/create-react-app template-test \
  --template file:../create-react-app/packages/cra-template-typescript/ \
  --scripts-version file:../create-react-app/packages/react-scripts/

e2e-kitchensink-eject was failing on Windows, as we use Git bash and $PWD. I've fixed that here.

e2e-installs targets --scripts-version=1.0.17. This is failing due to the new template being incompatible with our internal testing template. The fix for this will also cover the real case the someone could use the latest create-react-app and a forked or outdated `react-scripts package.

tasks/e2e-installs.sh

packages/create-react-app-template-typescript/package.json

iansu

Looks good! I left a few specific comments and also have a few more general thoughts:

This should be behind a flag in 3.x
Naming conventions
1. create-react-app-template-* is super long. I don't like using cra but maybe cra-template-* is better?
2. Having to include typescript in the name of a TypeScript template seems not feasible. Maybe check for typescript in the template dependencies?

I'm going to attempt to use your branch to create a custom template next and will probably have more feedback then.

packages/create-react-app-template-typescript/template.json

packages/create-react-app-template-typescript/package.json

iansu · 2019-10-09T17:47:04Z

packages/create-react-app-template-typescript/package.json

+      "url": "https://github.com/facebook/create-react-app/issues"
+    },
+    "files": [
+      "template",


Seems a bit weird to have a directory named template inside the template package. Can we put files at the root or maybe in src?

I tried agree, and I did try that, but this made more sense to me as for whitelisting files to publish. It also means that the project can have a separate README for the published package, vs what's installed with the template.

packages/create-react-app-template-typescript/package.json

packages/create-react-app/createReactApp.js

packages/react-scripts/config/paths.js

packages/react-scripts/scripts/init.js

ianschmitz

Just to confirm - --scripts-version will still work by itself until v4, correct?

packages/react-scripts/scripts/init.js

mrmckeb · 2019-10-22T06:46:45Z

@ianschmitz Correct, everything works without a template for now. A custom script would need to accept the template though, otherwise it would just use the template it has.

andriijas · 2019-10-23T05:52:29Z

First of all, awesome work! this will be a sweet addition to let others Kickstart apps even faster.

I share the concern of @iansu - the project officially don't use the cra prefix anywhere (?) but on the other hand. Almost everyone just calls the project cra for short.

Is "react-app-" to generic? (Clashes with react-app-rewired which is not a template)

mrmckeb · 2019-10-23T08:03:34Z

@andriijas, we could use a different prefix, but I know a lot of the community use the CRA acronym. I think it's safe to use... create-react-app is very long, react-app is likely to conflict with existing packages, like react-app-template.

This is the best we have I think...

andriijas · 2019-10-23T08:44:38Z

@mrmckeb you are right. Let's just acknowledge the community acronym. Excellent work with this! Can't wait to see what kinds of templates the community will bring. Bootstrapping new react apps in 2020 will literally get you productive in seconds!

petetnt

Few small comments :)

packages/cra-template-typescript/package.json

petetnt · 2019-10-24T08:12:38Z

packages/create-react-app/createReactApp.js

+  if (useTypeScript) {
+    console.log(
+      chalk.yellow(
+        'The --typescript option has been deprecated and will be removed in a future release.'


Should this message link to the templates documentation? Same with https://github.com/facebook/create-react-app/pull/7716/files#diff-f9867c1e09ced1328f2ccdac4afac4a5R88

It could do, but I can't create short links. @iansu?

We don't have our new shortlinks domain name set up yet. Maybe just make a TODO and we'll add it before the final release.

docusaurus/docs/adding-typescript.md

iansu · 2019-10-24T18:31:02Z

packages/create-react-app/createReactApp.js

+  if (useTypeScript) {
+    console.log(
+      chalk.yellow(
+        'The --typescript option has been deprecated and will be removed in a future release.'


We don't have our new shortlinks domain name set up yet. Maybe just make a TODO and we'll add it before the final release.

iansu · 2019-10-24T20:15:31Z

packages/cra-template/template/src/index.css

@@ -0,0 +1,13 @@
+body {


What is this file for? Was it in the original template?

iansu · 2019-10-24T21:01:21Z

azure-pipelines.yml

@@ -1,78 +1,79 @@
-#


This whole file shows as changed because it previously had windows line endings. 😞

iansu · 2019-10-24T21:09:20Z

Something has gone horribly wrong with our CI here. Appveyor is in the list of checks and we got rid of that like a year ago.

iansu · 2019-10-24T22:17:45Z

Thanks! ❤️

facebook-github-bot added the CLA Signed label Sep 22, 2019

mrmckeb force-pushed the feature/templates branch 4 times, most recently from 75c0ac7 to eda43e2 Compare September 22, 2019 18:09

mrmckeb marked this pull request as ready for review September 22, 2019 18:36

mrmckeb requested review from ianschmitz, iansu and petetnt as code owners September 22, 2019 18:36

mrmckeb requested review from iansu and removed request for iansu and petetnt September 22, 2019 18:36

mrmckeb force-pushed the feature/templates branch 4 times, most recently from fbdd34c to 3964653 Compare September 23, 2019 10:24

ianschmitz reviewed Sep 24, 2019

View reviewed changes

tasks/e2e-installs.sh Outdated Show resolved Hide resolved

packages/create-react-app-template-typescript/package.json Outdated Show resolved Hide resolved

ianschmitz added the tag: new feature label Sep 24, 2019

ianschmitz added this to the 3.2 milestone Sep 24, 2019

iansu suggested changes Oct 9, 2019

View reviewed changes

mrmckeb mentioned this pull request Oct 10, 2019

Add support for pnpm package manager #7791

Open

mrmckeb force-pushed the feature/templates branch from 3964653 to 3809678 Compare October 14, 2019 15:56

mrmckeb requested a review from amyrlam as a code owner October 14, 2019 15:56

mrmckeb self-assigned this Oct 14, 2019

mrmckeb added this to In progress in v3.3 via automation Oct 14, 2019

mrmckeb force-pushed the feature/templates branch 3 times, most recently from d1f43b5 to 6998bc6 Compare October 19, 2019 13:58

mrmckeb requested a review from iansu October 19, 2019 14:23

ianschmitz approved these changes Oct 22, 2019

View reviewed changes

packages/react-scripts/scripts/init.js Show resolved Hide resolved

mrmckeb force-pushed the feature/templates branch 2 times, most recently from 80e40df to b2a869e Compare October 23, 2019 08:25

andriijas approved these changes Oct 23, 2019

View reviewed changes

andriijas mentioned this pull request Oct 23, 2019

[WIP] Add react.config.js #7866

Closed

petetnt self-requested a review October 24, 2019 08:07

petetnt reviewed Oct 24, 2019

View reviewed changes

mrmckeb force-pushed the feature/templates branch from b2a869e to d81d7c4 Compare October 24, 2019 09:12

Add template support

83c226a

mrmckeb force-pushed the feature/templates branch from d81d7c4 to 83c226a Compare October 24, 2019 09:19

iansu reviewed Oct 24, 2019

View reviewed changes

Update templates version check

0db8cd0

iansu reviewed Oct 24, 2019

View reviewed changes

azure-pipelines.yml

@@ -1,78 +1,79 @@

#

Copy link

Contributor

iansu Oct 24, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This whole file shows as changed because it previously had windows line endings. 😞

iansu closed this Oct 24, 2019

v3.3 automation moved this from In progress to Done Oct 24, 2019

iansu reopened this Oct 24, 2019

v3.3 automation moved this from Done to In progress Oct 24, 2019

iansu added 2 commits October 24, 2019 14:19

Merge master into branch

7e53186

Update TypeScript template README

e4f478b

iansu merged commit 4c0c819 into master Oct 24, 2019

v3.3 automation moved this from In progress to Done Oct 24, 2019

ianschmitz deleted the feature/templates branch October 24, 2019 22:33

mrmckeb mentioned this pull request Oct 25, 2019

Add @testing-library to the default templates #7881

Merged

lock bot locked and limited conversation to collaborators Oct 29, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add template support #7716

Add template support #7716

mrmckeb commented Sep 22, 2019 •

edited

mrmckeb commented Sep 22, 2019 •

edited

iansu left a comment

iansu Oct 9, 2019

mrmckeb Oct 14, 2019

ianschmitz left a comment

mrmckeb commented Oct 22, 2019

andriijas commented Oct 23, 2019

mrmckeb commented Oct 23, 2019

andriijas commented Oct 23, 2019

petetnt left a comment

petetnt Oct 24, 2019

mrmckeb Oct 24, 2019

iansu Oct 24, 2019

iansu Oct 24, 2019

iansu Oct 24, 2019

iansu Oct 24, 2019

iansu commented Oct 24, 2019

iansu commented Oct 24, 2019 •

edited

Add template support #7716

Add template support #7716

Conversation

mrmckeb commented Sep 22, 2019 • edited

mrmckeb commented Sep 22, 2019 • edited

iansu left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ianschmitz left a comment

Choose a reason for hiding this comment

mrmckeb commented Oct 22, 2019

andriijas commented Oct 23, 2019

mrmckeb commented Oct 23, 2019

andriijas commented Oct 23, 2019

petetnt left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

iansu commented Oct 24, 2019

iansu commented Oct 24, 2019 • edited

mrmckeb commented Sep 22, 2019 •

edited

mrmckeb commented Sep 22, 2019 •

edited

iansu commented Oct 24, 2019 •

edited