Support templates in scoped packages

[klasbj]

Fixing issue #7985.

I learned a bit about some... interesting... NPM behavior while testing. With only a regex check that the package name started with cra-template-, it still fell back to cra-template-@scope/package. If scope/package happened to be an accessible Github project, npm would download and install some version (I'm not quite sure how it decided which version...) of that repository as the template.

The solution I came up with was adding the prefix to the package name, while leaving the scope part unchanged. Maybe not 100% intuitive, but consistent with the behaviour of non-scoped packages.

Test cases

Plain, uses cra-template

CRA_INTERNAL_TEST=1 yarn create-react-app my-app1
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app1.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with cra-template...
# [...]

Template without prefix (typescript), uses cra-template-typescript

CRA_INTERNAL_TEST=1 yarn create-react-app --template typescript my-app2
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app2.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with cra-template-typescript...
# [...]

Template with prefix (cra-template-typescript)

CRA_INTERNAL_TEST=1 yarn create-react-app --template cra-template-typescript my-app3
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app3.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with cra-template-typescript...
# [...]

Template in scoped npm package with prefix (@klasbj/cra-template-scoped)

CRA_INTERNAL_TEST=1 yarn create-react-app --template "@klasbj/cra-template-scoped" my-app4
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app4.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with @klasbj/cra-template-scoped...
# [...]

Template in scoped npm package without prefix (@klasbj/scoped), uses @klasbj/cra-template-scoped

CRA_INTERNAL_TEST=1 yarn create-react-app --template "@klasbj/scoped" my-app5
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app5.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with @klasbj/cra-template-scoped...
# [...]

Scoped template with matching Github project, attempts to use @klasbj/cra-template-scoped-cra-template, and not my Github project klasbj/scoped-cra-template

CRA_INTERNAL_TEST=1 yarn create-react-app --template "@klasbj/scoped-cra-template" my-app6
# [...]
# Creating a new React app in /home/klasse/projects/create-react-app/my-app6.
#
# Installing packages. This might take a couple of minutes.
# Installing react, react-dom, and react-scripts with @klasbj/cra-template-scoped-cra-template...
#
# [1/4] Resolving packages...
# error An unexpected error occurred: "https://registry.yarnpkg.com/@klasbj%2fcra-template-scoped-cra-template: Not found".
# info If you think this is a bug, please open a bug report with the information provided in "/home/klasse/projects/create-react-app/my-app6/yarn-error.log".
# info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
#
# Aborting installation.
#   yarnpkg add --exact react react-dom /home/klasse/projects/create-react-app/packages/react-scripts/react-scripts-3.2.0.tgz @klasbj/cra-template-scoped-cra-template --cwd /home/klasse/projects/create-react-app/my-app6 has failed.
#
# Deleting generated file... package.json
# Deleting generated file... yarn.lock
# Done.
# [...]

[facebook-github-bot]

Hi klasbj! Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file.In order for us to review and merge your code, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA.

If you have received this in error or have any questions, please contact us at [email protected]. Thanks!

[facebook-github-bot]

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks!

[mrmckeb]

Thanks @klasbj, this looks great.

[mrmckeb]

Thanks again!