Die Verwendung von Yeoman und die Erstellung eines benutzerdefinierten Generators

Installieren Sie yeoman

npm installiere yo

Garn global add yo

Generator installieren

Z.B

npm install generator-node

npm install generator-webapp

Oder verwenden Sie Garn

Garn global hinzufügen Generator-Webapp

Weitere Anforderungen entnehmen Sie bitte den offiziellen Unterlagen

Offizielle Generatorabfrage

Verwenden Sie entsprechende Generatoren

Verwenden Sie den Befehl

Zum Beispiel: yo webapp

yo gefolgt vom Kategorienamen, der vom Generator heruntergeladen wurde

Passen Sie einen Generator an

Es ist im Wesentlichen ein npm-Tool und seine Grundstruktur folgt dem Folgenden

[Die Bildübertragung für externe Links ist fehlgeschlagen. Die Quellwebsite verfügt möglicherweise über einen Anti-Blutegel-Link-Mechanismus. Es wird empfohlen, das Bild zu speichern und direkt hochzuladen (img-kCSkpxNc-1610605403519) (C: \ Users \ EDZ \ AppData \ Roaming \ Typora) \ typora-user-images \ image-20210114135107110.png)]

Erstellen Sie einen neuen Ordner, der Name des Ordners muss Generatorname sein !
Garninit zur Initialisierung
Garn add yeoman-generator, um eine benutzerdefinierte Generatorplattform herunterzuladen
Neues Verzeichnis:

Generators / app / index.js

Hinweis: Generatoren müssen plural sein
Schreiben Sie Code in index.js

 const Generator = require('yeoman-generator')
       // generator 和 核心入口
   module.exports = class extends Generator {
    
    
       // 自动导出生命周期方法
       // 文件写入的功能
       writing() {
    
    
           //     // yeoman 自动调用这个方法
              this.fs.write(         	 //接收两个参数 一个是路径 ，一个是写入内容	   
              		this.destinationPath('test.txt'),
                   Math.random().toString()
                )
       }
   
   }

Verwenden Sie den Befehl yarn init für die Befehlsbindung, damit Sie den Namen des benutzerdefinierten Generators direkt in die Befehlszeile eingeben können, um diesen Generator zu verwenden

Verwenden Sie einen benutzerdefinierten Generator

Erstellen Sie einen neuen Ordner zum Speichern der zu generierenden Dateien
Verwenden Sie den Befehl yo name (dieser Name ist der Name des gerade erstellten Generators)

Sie werden feststellen, dass eine Datei automatisch generiert wird
Fügen Sie hier eine Bildbeschreibung ein

Erstellen Sie Dateien aus Vorlagen

Erstellen Sie gerade einen Ordner mit dem Namen Vorlagen unter der App-Datei
Erstellen Sie eine neue Datei foo.txt als Ausgabeziel

Schreiben Sie den Code in index.js (da dies anders ist und Sie den ursprünglichen Code ändern müssen)

const Generator = require('yeoman-generator')
    // generator 和 核心入口
module.exports = class extends Generator {
      
      
    // 自动导出生命周期方法
    // 文件写入的功能
    writing() {
      
      
        // 模板文件的目录
        const tmpl = this.templatePath('foo.txt')
        // 输出目标路径
        const output = this.destinationPath('foo.txt')
        // 模板数据上下文
        const context = {
      
       title: 'Generator ...', success: false }
        this.fs.copyTpl(tmpl, output, context)
    }

}

Gehen Sie zurück zu dem Ordner, den wir gerade erstellt haben, und verwenden Sie den Befehl yo name

Wir können sehen, dass sich eine foo.txt-Datei im Verzeichnis befindet

Fügen Sie hier eine Bildbeschreibung ein

Gleichzeitig ist auch die EJS-Syntax wirksam