Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/itsjonq/remake
🦋 Remake: A simple generator from locally defined templates
https://github.com/itsjonq/remake
cli generator javascript nodejs react template
Last synced: 3 days ago
JSON representation
🦋 Remake: A simple generator from locally defined templates
- Host: GitHub
- URL: https://github.com/itsjonq/remake
- Owner: ItsJonQ
- License: mit
- Created: 2018-12-16T16:02:20.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-03-02T21:13:17.000Z (over 1 year ago)
- Last Synced: 2024-11-08T08:26:42.958Z (9 days ago)
- Topics: cli, generator, javascript, nodejs, react, template
- Language: JavaScript
- Homepage:
- Size: 3.54 MB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🦋 Remake
[![Build Status](https://travis-ci.org/ItsJonQ/remake.svg?branch=master)](https://travis-ci.org/ItsJonQ/remake)
[![npm version](https://badge.fury.io/js/%40itsjonq%2Fremake.svg)](https://badge.fury.io/js/%40itsjonq%2Fremake)> A simple generator from locally defined templates!
```
Usage: remake
🦋 Remakeremake --option
Example:
remake component --name=MyComponent --someProp=valueOptions:
-V, --version output the version number
-n, --name The name for the generate file(s)
-o, --output Location to output generated file(s)
-i, --entry Location of the template file(s)
-w, --overwrite Overwrite existing files
-s, --silence Suppresses the logs
-h, --help output usage informationCommands:
* The directory name for the template under .remake/
```## Table of contents
- [Installation](#installation)
- [Usage](#usage)
- [Create the template files](#create-the-template-files)
- [Run the command](#run-the-command)
- [Example](#example)
- [License](#license)## Installation
```
npm install --save-dev @itsjonq/remake
```To install it globally, run:
```
npm install -g @itsjonq/remake
```## Usage
### Create the template files
In your project's root directory, create a new directory called `.remake`:
```
my-app/
├── .remake/
└── .../
```Within the `.remake` directory, create sub directories to associate with "commands" that you would like Remake to run. In this example, we'll create a directory called `component`, which Remake will use when running the command `component`:
```
my-app/
├── .remake/
│ └── component/
└── .../
```Under the new `component` directory, we'll add a couple of files that we want Remake to generate for us:
```
my-app/
├── .remake/
│ └── component/
│ └── remake-name/
│ ├── index.js
│ └── remake-name.js
└── .../
```Notice the `remake-name` directory and `remake-name.js` file. Remake will use `props` you provide to replace any `remake-*` file name. For this example, the file name will be replaced with the `name` prop.
Within the `remake-name.js`, let's add some template content:
```jsx
// component/remake-name/remake-name.js
import React from 'react'export class <%= name %> extends React.PureComponent {
render () {
return
}
}export default <%= name %>
```Notice the `<%= name %>`. Remake uses [lodash.template](https://lodash.com/docs/4.17.11#template) to parse and modify template files. The `name` prop is provided to the template through CLI arguments. You can specify anything you'd like! Including `if/else` logic, if you wanna get fancy.
### Run the command
Once you're happy with your template files, run the `remake` command.
The recommended way is to add a `remake` script to your project's `package.json`, like so:
```
...
"remake": "remake",
...
```You can even add the options to dedicated `remake` scripts for more commonly generated templates:
```
"remake:component": "remake component --output=src/components"
```Alternatively, if you've installed `remake` globally, you can run:
```
remake component --name=Hello
```For this example, remake will generate the following files:
```
my-app/
├── .remake/
│ └── component/
│ └── remake-name/
│ ├── index.js
│ └── remake-name.js
├── Hello
│ ├── index.js
│ └── Hello.js
└── .../
```If we take a look at `Hello.js`, you'll see that the `<%= name %>` variables have been replaced by `Hello`, specified by `--name=Hello`:
```jsx
// Hello/Hello.js
import React from 'react';export class Hello extends React.PureComponent {
;
render() {
return
}
}export default Hello;
```## Example
Check out the example in the [`example` directory](https://github.com/ItsJonQ/remake/tree/master/example) 🙌
## License
MIT © [Q](https://jonquach.com)