Package Exports
- code-template-generator
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (code-template-generator) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
code-template-generator
Table of contents
1. Introduction
This is the lightweight React code template generator that has two main parts in one npm package:
- Project template generation that has a part of the Build environments project.
- Code template generation.
You have more choice for your development environment. It makes your life easier.
Screenshot

What's new in version 2.2.x
- Why?
- You may have your own libraries, code templates and many more like .gitignore, .editorconfig, .eslinttrc.json, .eslintignore,... You need to use them while you are coding or when you start a new project.
- You don't want do the same things (copy/ paste) many times.
- This feature makes you happy ;-)
- New feature:
- New options:
-cf, --configand-m, --my-asset. - Using:
generate -cf --set-asset <path-to-your-directory>: to store the path to a directory that has your files, sub directories. We say at they are your assets. View examples:- Windows system:
generate -cf --set-asset "C:\Users\YourName\MyAssets". - Linux system:
generate -cf --set--asset "/home/yourname/myassets"
- Windows system:
generate -m: to retrieve your assets into the current work directory. You can choose them by selecting. That's all.
- New options:
- Improvement:
- Performance.
- Resolving handling.
- Error handling.
2. Main features
- Project template generation:
- Without Git support.
- With Git support -> It runs automatically command
git initand generates a.gitignorefile while the project is generated.
- Component generation:
- Two kinds of generated components: React and React-Redux.
- It can become a single component that is a file
*.js, *.jsxor a full component that is a directory with two files*.js, *.cssare within.
.gitignorefile generation.- Automatic update checking for the latest stable version.
- Project templates:
- It's simple for:
- Configuration and installation for the dependencies you need.
- Using together with or moving to/from an other React build environment.
- Code splitting.
- Image handling.
- CSS, JS code injected automatic into HTML template.
- Hot Module Replacement (HMR) is enabled.
- You don't need to care about the distribution directory
/dist. The things you care are only the source directory/src. - Anti-caching.
- It's simple for:
Supported project templates
| Templates | Main dependencies |
|---|---|
| react-advance | Babel 7, Babel Loader 8, SplitChunksPlugin for code splitting |
| react-simple | Babel 7, Babel Loader 8 |
| react-typescript | TypeScript 3, awesome-typescript-loader |
You can view more details about these project templates in this repository Build environments.
Supported component templates
| Component | React | React-Redux (*) | Description |
|---|---|---|---|
| Single | X | X | A file with these supported extension *.js, *.jsx. |
| Full | X | X | A directory with two files *.js, *.css that are generated within. |
(*) You install and config Redux, React-Redux by yourself.
3. Installation
$ npm i -g code-template-generator
System requirements:
- The minimum supported Node.js version is 8.3.0 (Node.js LTS is a good choice for many reasons).
- Administrator permission is required when you run the command
$ generate -ufor the latest stable version updating.
4. Using
$ generate [option] <project-name>[<component-name>]
| Argument | Used with | Description |
|---|---|---|
<project-name> |
- | Generate a new project by the chosen template (without Git support) |
-g |
<project-name> |
Git support is installed automatically by git init and a .gitignore file is also created on the root of work directory while a new project is generated |
-c |
<component-name.js> |
It will be generate a single React component (*.js or *.jsx) in the current directory |
-r |
<component-name.js> |
It will be generate a single React-Redux component (*.js or *.jsx) in the current directory |
-fc |
<component-name> |
It will be generate a full React component that is a directory with *.js, *.css files in the current directory |
-fr |
<component-name> |
It will be generate a full React-Redux component that is a directory with *.js, *.css files in the current directory |
-i |
- | A .gitignore file will be generated in the current directory |
-v |
- | View the installed version |
-help |
- | View the help information |
-u |
- | Automatic update checking and installation for the latest stable version (*) |
(*) Administrator permission is required. Here is an example for MacOS and Ubuntu system:
$ sudo generate -u
Sub option
--no-install: no install dependencies when a project is generated.
| Main flag | Sub flag | Used with | Description |
|---|---|---|---|
| - | --no-install |
<project-name> |
Generate a project without both Git support and installation of dependencies |
-g |
--no-install |
<project-name> |
Generate a project with Git support but without installation of dependencies |
Aliases
| Argument | Alias |
|---|---|
-g |
--git |
-c |
--component |
-r |
--redux-component |
-fc |
--full-component |
-fr |
--full-redux-component |
-i |
--gitignore |
-v |
--version |
-help |
--help |
-u |
--update |
5. Examples
// Project
$ generate first-project // Without Git support
$ generate -g secondproject // With Git support
$ generate --git ThirdProject // Using alias --git instead of -g
$ generate -g --no-install OtherProject // Without installation of dependencies
$ generate --no-install LastProject
// Single component -> A file
$ generate -c SearchComponent.js // React component
$ generate -r ReviewComponent.jsx // React-Redux component
// Full component -> A directory
$ generate -fc ProductComponent
$ generate -fr CartComponent
// Other
$ generate --gitignore // A .gitignore file
$ generate -v // View the installed version
$ generate -help // View the help information
$ generate --update // Check and install the latest stable version6. Thank you!
Special thanks to Harriet Ryder!
Many thanks to Commander.js for the inspiration.