illa-helper ist ein Open-Source-Browser-Plugin, das Benutzern helfen soll, eine Fremdsprache durch eine immersive Erfahrung zu lernen. Es bietet Echtzeit-Übersetzungen, Aussprachehilfen und Vokabular-Parsing, während man im Internet surft. Das Plugin unterstützt die Browser Chrome und Firefox und basiert auf dem Vue 3-Framework, das übersichtlich und einfach zu erweitern ist. Die Benutzer können die Einstellungen anpassen, z. B. das Übersetzungsmodell oder den API-Schlüssel. illa-helper eignet sich besonders für Lernende, die ihre Sprachkenntnisse während des täglichen Surfens auf natürliche Weise verbessern möchten. Das Projekt wird auf GitHub gehostet und es steht Entwicklern frei, Beiträge zu leisten und die Funktionen zu optimieren.
Funktionsliste
- Echtzeit-Übersetzung: Übersetzt fremdsprachige Texte auf Webseiten in eine Sprache, die dem Benutzer vertraut ist.
- Aussprachehilfe: Bietet die Aussprache von Wörtern oder Sätzen durch Youdao TTS und Web Speech API.
- Wortschatzanalyse: zeigt die phonetischen Symbole, Definitionen und Beispielsätze von Wörtern an und unterstützt eine interaktive Schnittstelle.
- Benutzerdefinierte Einstellungen: Unterstützt vom Benutzer konfigurierbare API-Schlüssel, Übersetzungsmodelle und Temperaturparameter.
- Browserübergreifende Unterstützung: Kompatibel mit Chrome und Firefox, Anpassung an verschiedene Browserfunktionen.
- Hoverbox-Schnittstelle: Bietet intuitive Hoverboxen, die Übersetzungs- und Ausspracheinformationen anzeigen.
- Offline-Speicher: Speichert die Benutzereinstellungen und stellt sicher, dass personalisierte Erlebnisse geräteübergreifend synchronisiert werden.
Hilfe verwenden
Einbauverfahren
- Plugin-Quellcode herunterladen
Interviewshttps://github.com/xiao-zaiyi/illa-helper
Klicken Sie auf die Schaltfläche "Code" und wählen Sie "ZIP herunterladen", um den Quellcode herunterzuladen, oder verwenden Sie den Befehl Git, um das Repository zu klonen:git clone https://github.com/xiao-zaiyi/illa-helper.git
- Installation von Abhängigkeiten
Nachdem Sie die Dateien extrahiert haben, wechseln Sie in das Projektverzeichnis und führen Sie den folgenden Befehl aus, um die erforderlichen Abhängigkeiten zu installieren:npm install
Stellen Sie sicher, dass Node.js und npm installiert sind.
- Umgebungsvariablen konfigurieren
Erstellen Sie im Stammverzeichnis des Projekts die Datei.env
Datei, fügen Sie z. B. API-Schlüssel und Konfigurationen hinzu:VITE_WXT_DEFAULT_API_KEY="sk-your-real-api-key" VITE_WXT_DEFAULT_API_ENDPOINT="https://xxxxx/api/v1/chat/completions" VITE_WXT_DEFAULT_MODEL="gpt-4" VITE_WXT_DEFAULT_TEMPERATURE="0.2"
Diese Einstellungen werden für die Verbindung mit Übersetzungs- und Aussprachediensten verwendet. Achtung!
.env
Die Dokumentation wurde hinzugefügt.gitignore
Der Schlüssel ist gesichert. - Plug-ins erstellen
Führen Sie den Build-Befehl basierend auf dem Zielbrowser aus:- Chrom/Kante:
npm run build:chrome
- Firefox:
npm run build:firefox
Wenn der Build abgeschlossen ist, befindet sich die Ausgabedatei unter
.output/chrome-mv3
(Chrome) oder.output/firefox-mv2
(Firefox). - Chrom/Kante:
- Laden von Plug-ins
- Chrom: Öffnen Sie Ihren Browser und gehen Sie zu
chrome://extensions/
Wenn Sie den "Entwicklermodus" aktivieren möchten, klicken Sie auf "Erweiterungen laden" und wählen Sie "Erweiterungen laden"..output/chrome-mv3
Mappe. - Firefox: Zugang
about:debugging#/runtime/this-firefox
Klicken Sie auf "Temporäre Add-ons laden" und wählen Sie.output/firefox-mv2
Ordner. Das Plugin wird automatisch geladen.
- Chrom: Öffnen Sie Ihren Browser und gehen Sie zu
Verwendung
Nach der Installation wird illa-helper in Ihrem Browser ausgeführt. Nachfolgend finden Sie eine detaillierte Beschreibung der Hauptfunktionen:
Echtzeit-Übersetzung
- Öffnen Sie eine beliebige Webseite und wählen Sie den zu übersetzenden Text aus.
- Das Plugin erkennt automatisch den fremdsprachigen Inhalt und zeigt die Übersetzungsergebnisse in einer Hover-Box an.
- Die Benutzer können auf die Schaltfläche "Kopieren" in der Hover-Box klicken, um die Übersetzung in der Zwischenablage zu speichern.
- Wenn Sie die Übersetzungssprache ändern möchten, gehen Sie auf die Seite mit den Plugin-Optionen (klicken Sie mit der rechten Maustaste auf das Plugin-Symbol und wählen Sie "Optionen") und stellen Sie die Zielsprache ein.
Aussprachehilfen
- Wählen Sie das Wort oder den Satz aus, und das Schwebefeld zeigt die Schaltfläche für die Aussprache (🔊) an.
- Klicken Sie auf die Schaltfläche Aussprache, und das Plugin spielt den Ton über Youdao TTS oder Web Speech API ab.
- Der Benutzer kann die Artikulationsgeschwindigkeit oder die Art der Stimme einstellen (auf der Seite Optionen zu konfigurieren).
lexikalische Analyse
- Die Hover-Box zeigt die phonetischen Symbole, Definitionen und Beispielsätze für den ausgewählten Text an.
- Klicken Sie auf die Schaltfläche "Mehr", um detaillierte Wörterbuchinformationen anzuzeigen (z. B. Worteigenschaften, Synonyme).
- Wenn Sie das Vokabular speichern müssen, klicken Sie auf "Zum Vokabular hinzufügen" und das Plug-in speichert das Vokabular lokal.
Benutzerdefinierte Einstellungen
- Öffnen Sie die Plugin-Optionen-Seite und ändern Sie den API-Schlüssel oder das Übersetzungsmodell (Standard)
gpt-4
). - anpassen
VITE_WXT_DEFAULT_TEMPERATURE
(0,0-1,0), der die Kreativität der Übersetzung steuert (niedrigere Werte sind genauer, höhere Werte sind flexibler). - Sobald die Einstellungen abgeschlossen sind, klicken Sie auf "Speichern" und das Plugin wird die Konfiguration automatisch synchronisieren.
caveat
- Sorgen Sie für eine stabile Internetverbindung, damit die Übersetzungs- und Aussprachefunktionen richtig funktionieren.
- Firefox-Benutzer sollten beachten, dass das Plugin eine bestimmte ID für seine Speicherfunktionalität in Firefox benötigt, die bereits in der
wxt.config.ts
Mittlere Konfiguration:browser_specific_settings: { gecko: { id: 'illa-helper@xiao-zaiyi', strict_min_version: '88.0' } }
- Wenn Sie Probleme mit der API-Konnektivität haben, überprüfen Sie die
.env
Schlüssel und Endpunktkonfiguration in der Datei.
Anwendungsszenario
- Fremdsprachenstudium
Studenten oder Selbstlerner nutzen illa-helper, um Übersetzungen und Aussprachen in Echtzeit zu erhalten, Inhalte schnell zu verstehen und neue Vokabeln zu lernen, während sie auf fremdsprachigen Websites surfen. - akademische Forschung
Wenn Forscher fremdsprachige Literatur lesen, übersetzt das Plug-in die Terminologie und speichert die Rohwörter, um die Leseeffizienz zu verbessern. - Tägliches Browsen
Nicht-Muttersprachler nutzen Plug-ins, um fremdsprachliche Inhalte schnell zu verstehen und den Zugang zu Informationen zu verbessern, wenn sie in sozialen Medien oder Nachrichten surfen. - Debugging für Entwickler
Entwickler können verschiedene Übersetzungsmodelle oder APIs testen, um die Leistung des Plugins durch Änderung des Quellcodes oder der Konfiguration zu optimieren.
QA
- Welche Browser werden von illa-helper unterstützt?
Chrome und Firefox werden derzeit unterstützt, mit Chrome Manifest V3 bzw. Firefox Manifest V2. - Muss ich für die Nutzung bezahlen?
illa-helper ist ein Open-Source-Projekt und kann kostenlos genutzt werden. Allerdings müssen Sie sich den API-Schlüssel für den Übersetzungs- oder Aussprachedienst selbst besorgen, was mit Kosten verbunden sein kann. - Wie kann ich das Plugin aktualisieren?
Ziehen Sie den neuesten Code von GitHub und führen Sie den Build- und Ladeprozess erneut aus, um ihn zu aktualisieren. - Was ist, wenn die Übersetzung nicht korrekt ist?
Überprüfen Sie den API-Schlüssel und die Modellkonfiguration, oder versuchen Sie, dieVITE_WXT_DEFAULT_TEMPERATURE
Parameter. - Kann es offline verwendet werden?
Einige Funktionen (z. B. die lokale Speicherung) werden offline unterstützt, aber für die Übersetzung und Aussprache ist ein Internetzugang erforderlich.