[RUBY] Bereiten Sie die Formatumgebung für "Rails" (VScode) vor.

Wie haben Sie diesen Artikel geschrieben?

Bei der Entwicklung mit Rails habe ich mit VScode entwickelt. Das Format funktionierte nicht wie erwartet mit Rubocop allein, und ich hatte Probleme. In der Rails-Umgebung sind mindestens die Dateien .rb und .erb erforderlich. Darüber hinaus ist es praktisch, die Formatierungsunterstützung auf andere Sprachen (JavaScript, Yaml usw.) ausweiten zu können.

Ich weiß nichts über andere Editoren, aber ich denke, dass das Erstellen mit VScode einen Sinn hat.

Ich habe einen Fehler gemacht, weil ich ein Anfänger bin, aber ich hoffe, Sie können freundlich darauf hinweisen.

Zweck dieses Artikels

• Bereiten Sie eine stabile Rails-Codierungsumgebung vor (Ruby, erb-Formatumgebung).
• Kann mit dem Analyse-Tool-Formatierer Rubocop verwendet werden
• Einführung eines Formatierers, der auf andere Sprachen erweitert werden kann, und stabiler Betrieb

Überprüfungsumgebung

Rails v6.0.3.3 Ruby v2.6.6 Rubocop v0.89.1

・ Erweiterte Funktion Ruby v0.27.0 Prettier v5.6.0 Prettier+ v4.2.2 Beautify v1.5.0

・ Installation prettier/plugin-ruby v0.20.0

1. VS-Codeeinstellung (Einstellung json)

Vor dem Formatieren habe ich die folgenden Einstellungen in den Editor gestellt. Der Editor-Einstellungsbildschirm kann mit "Befehl +" angezeigt werden. Öffnen Sie die Datei settings.json und fügen Sie die folgenden Einstellungen ein. settings.json ist ein Symbol, das als "Einstellungen (JSON)" angezeigt wird, wenn es mit dem Symbol oben rechts im Einstellungsbildschirm übereinstimmt. Wenn Sie auf das Symbol klicken und die folgenden Einstellungen vornehmen

• Einstellung zum Entfernen von nachgestellten Leerzeichen und Einfügen einer neuen Zeile in die letzte Zeile
• Automatisches Format

Ist reflektiert.

settings.json

{
  "files.trimFinalNewlines": true, #Schneiden neuer Zeilen nach der letzten Zeile beim Speichern der Datei
  "files.insertFinalNewline": true, #Fügen Sie beim Speichern der Datei die letzte Zeile am Ende hinzu
  "files.trimTrailingWhitespace": true, #Hintere Rohlinge abschneiden
  "editor.formatOnSave": true, #Automatisches Format beim Speichern einer Datei
}

1. Ruby-Format-Umgebung

Als ein Verfahren, zunächst vorausgesetzt, dass Rubocop mit Edelstein installiert ist, Mit VScode-Erweiterung

• Prettier
• Prettier+
  Installieren. * Vergessen Sie nicht, beide zu installieren.

Installieren Sie dann das schönere Plug-In im Rails-Entwicklungsprojekt.

Die Formatierer Prettier und Prettier + unterstützen Ruby standardmäßig nicht, werden jedoch von Plug-Ins unterstützt.

Ich werde sofort versuchen, das Plug-In wie auf der offiziellen Website beschrieben zu installieren und auszuführen. Offizielle Seite: Plugin-Ruby

Meine Umgebung ist Rails6, also habe ich es mit Garn installiert.

yarn add --dev prettier @prettier/plugin-ruby`

Die gleichzeitige Ausführung in der Rails-Umgebung kann mit dem folgenden Befehl ausgeführt werden.

./node_modules/.bin/prettier --write '**/*.rb'

Damit ist die Formatierung der vorhandenen Ruby-Datei abgeschlossen. Starten Sie nach dem Speichern alle zugehörigen Programme wie Editor und Docker neu.

Öffnen Sie nach dem Neustart eine rb-Datei und überprüfen Sie, ob Prettier und Prettier + unten rechts im Editor aktiviert sind.

Fügen Sie dann einige leere Zeichen oder Zeilenumbrüche in die Datei ein, speichern Sie sie und überprüfen Sie, ob das Format ausgeführt wird. Wenn Sie es gut können, ist die Ruby-Formatierung abgeschlossen.

2. Erb-Format

Installieren Sie die Erweiterung verschönern. Warum gibt es einen schöneren? Ich denke, es gibt eine Meinung, Eigentlich ist das in Ordnung, aber wenn Sie wie folgt einstellen, werden einige Layouts gelöscht und erb wird schwer zu verstehen sein. Dies geschieht, weil erb von HTML erkannt wird.

Schöneres Beispiel

settings.json

"files.associations": {
   "*.html.erb": "html"
}

Beispiel in Prettier anzeigen (Highlights verschwinden und sind schwer zu verstehen)

Installieren Sie verschönern mit der Erweiterung und geben Sie die Einstellungen in settings.json wie folgt ein.

  "beautify.language": {
    "html": ["htm", "html", "erb"]
  },

Jetzt ist das HTML-Format an erb angepasst und die Highlights von erb werden angezeigt, damit Sie leicht verständlich arbeiten können.

3. JavaScript-Format

Um das JavaScript zu formatieren, spiegeln Sie einfach die hübscheren Einstellungen in json wider.

settings.json

"[javascript]": {
  "editor.defaultFormatter": "esbenp.prettier-vscode"
},

Zusätzliche Bemerkungen

Ich habe ein Beispiel für eine Rails-Formatumgebung in VScode vorgestellt. Details zu verschiedenen Einstellungen wurden weggelassen. Detaillierte Einstellungen finden Sie auf der offiziellen Website. Wenn die oben genannten Einstellungen nicht funktionieren, sind möglicherweise andere Erweiterungen im Weg. Bitte deaktivieren Sie die Erweiterung und überprüfen Sie den Betrieb.

Schließlich

Ich denke nicht, dass die Umgebung, die ich gebaut habe, der beste Weg ist, sie zu bauen. Als Beispiel für die Erstellung einer Rails-Umgebung hoffe ich, dass die erstellte Formatumgebung für andere Personen so hilfreich wie möglich ist.