Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit0e4d142

Browse files
committed
update readme
1 parent9c183b4 commit0e4d142

File tree

1 file changed

+88
-10
lines changed

1 file changed

+88
-10
lines changed

‎README.md

Lines changed: 88 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,19 +4,22 @@ A simple CLI for scaffolding Vue.js projects.
44

55
###Installation
66

7-
Prerequisites:[Node.js](https://nodejs.org/en/) and[Git](https://git-scm.com/).
7+
Prerequisites:[Node.js](https://nodejs.org/en/)(>5.x preferred)and[Git](https://git-scm.com/).
88

99
```bash
1010
$ npm install -g vue-cli
1111
```
1212

1313
###Usage
1414

15+
```bash
16+
$ vue init<template-name><project-name>
17+
```
18+
19+
Example:
20+
1521
```bash
1622
$ vue init webpack my-project
17-
$cd my-project
18-
$ npm install
19-
$ npm run dev
2023
```
2124

2225
The above command pulls the template from[vuejs-templates/webpack](https://github.com/vuejs-templates/webpack), prompts for some information, and generates the project at`./my-project/`.
@@ -53,16 +56,91 @@ The shorthand repo notation is passed to [download-git-repo](https://github.com/
5356

5457
If you would like to download from a private repository use the`--clone` flag and the cli will use`git clone` so your SHH keys are used.
5558

56-
You can also create your own template from scratch:
59+
###Local Templates
60+
61+
Instead of a GitHub repo, you can also use a template on your local file system:
62+
63+
```bash
64+
vue init~/fs/path/to-custom-template my-project
65+
```
66+
67+
###Writing Custom Templates from Scratch
5768

5869
- A template repo**must** have a`template` directory that holds the template files.
5970

60-
-All templatefiles will be piped through Handlebars for simple templating -`vue-cli` will automatically infer the prompts based on`{{}}` interpolations found inthefiles.
71+
-A templaterepo**may** have a`meta.json` file that provides metadata for the template. The`meta.json` can containthefollowing fields:
6172

62-
- A template repo**may** have a`meta.json` file that provides a schema for the prompts. The schema will be passedto[inquirer](https://github.com/SBoudrias/Inquirer.js). See[example](https://github.com/vuejs-templates/webpack/blob/master/meta.json). We support`string`,`boolean` and`checkbox` (for multi choice) types.
73+
-`prompts`: usedtocollect user options data;
6374

64-
While developing your template you can test via`vue-cli` with:
75+
-`filters`: used to conditional filter files to render.
6576

66-
```bash
67-
vue init~/fs/path/to-custom-template my-project
77+
-`completeMessage`: the message to be displayed to the user when the template has been generated. You can include custom instruction here.
78+
79+
####prompts
80+
81+
The`prompts` field in`meta.json` should be an object hash containing prompts for the user. For each entry, the key is the variable name and the value is an[Inquirer.js question object](https://github.com/SBoudrias/Inquirer.js/#question). Example:
82+
83+
```json
84+
{
85+
"prompts": {
86+
"name": {
87+
"type":"string",
88+
"required":true,
89+
"message":"Project name"
90+
}
91+
}
92+
}
93+
```
94+
95+
After all prompts are finished, all files inside`template` will be rendered using[Handlebars](http://handlebarsjs.com/), with the prompt results as the data.
96+
97+
#####Conditional Prompts
98+
99+
A prompt can be made conditional by adding a`when` field, which should be a JavaScript expression evaluated with data collected from previous prompts. For example:
100+
101+
```json
102+
{
103+
"prompts": {
104+
"lint": {
105+
"type":"confirm",
106+
"message":"Use a linter?"
107+
},
108+
"lintConfig": {
109+
"when":"lint",
110+
"type":"list",
111+
"message":"Pick a lint config",
112+
"choices": [
113+
"standard",
114+
"airbnb",
115+
"none"
116+
]
117+
}
118+
}
119+
}
120+
```
121+
122+
The prompt for`lintConfig` will only be triggered when the user answered yes to the`lint` prompt.
123+
124+
#####Pre-registered Handlebars Helpers
125+
126+
Two commonly used Handlebars helpers,`if_eq` and`unless_eq` are pre-registered:
127+
128+
```handlebars
129+
{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
68130
```
131+
132+
####File filters
133+
134+
The`filters` field in`meta.json` should be an object hash containing file filtering rules. For each entry, the key is a[minimatch glob pattern](https://github.com/isaacs/minimatch) and the value is a JavaScript expression evaluated in the context of prompt answers data. Example:
135+
136+
```json
137+
{
138+
"filters": {
139+
"test/**/*":"needTests"
140+
}
141+
}
142+
```
143+
144+
Files under`test` will only be generated if the user answered yes to the prompt for`needTests`.
145+
146+
Note that the`dot` option for minimatch is set to`true` so glob patterns would also match dotfiles by default.

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp