Create React apps using custom templates. This is a wrapper of create-react-app
so you can use all its power here. See the docs for more details.
If you are using npm 5.2 or later, no installation is required. You can simply use npx
to run Craft as follows:
$ npx -p craft-cli craft <project-directory> <template-url>
If you are using an older version of npm, you must install Craft and create-react-app before running:
$ npm install -g craft-cli
$ npm install -g create-react-app
$ craft <project-directory> <template-url>
Craft will verify that create-react-app is available and warn you if you need to install it.
A template is simply a Git repository containing files that you wish to add to the project generated by create-react-app. There are no constraints on the contents of your templates. By default, all files will be copied from your template, overriding generated files with the same name, except for node_modules
, package.json
, package-lock.json
, craft.yaml
, and .git
.
If your template contains a package.json
file, the scripts and dependencies will be merged with the ones generated by create-react-app. Any other changes to sections defined in the generated file will be ignored, and any other sections not generated will be included.
Your template can include a craft.yaml
file that declares a spec, customizing
the application of the template to the project generated by create-react-app. Here is an example:
# A sample craft spec
spec:
ignore:
- .gitignore
- public
delete:
- src/App.css
- src/logo.svg
- src/serviceWorker.js
This example specifies that the generated .gitignore
file and public
directory should be left unchanged, even if the template includes those files, and that the generated App.css
, logo.svg
and serviceWorker.js
files in src
should be deleted.
Notice that the spec
is an object. Each of its properties is a directive, with a value listing the paths of files and/or directories to which it applies. The valid directives are replace
, ignore
, and delete
:
- replace copies the file or directory from the template, replacing a generated file or directory with the same name, if one exists.
- ignore leaves the specified file or directory exactly as generated (or not) by create-react-app. A file or directory with the same name in the template is ignored.
- delete deletes the file or directory from the generated project.
Each path is relative to the project root, always uses forward slash (/
) as a delimiter, and never has a leading or trailing slash. If a directive only has one path, it can be expressed directly as the value of the directive property, rather than in a single-item list.
By default, package.json
is merged; node_modules
, package-lock.json
, craft.yaml
, and .git
are ignored, and everything else is replaced. You can specify any of these files in your spec to override these defaults.