So verwenden Sie die vue-clibabel-Konfigurationsdatei.babelrc

Dieses Mal werde ich Ihnen zeigen, wie Sie die vue-clibabelKonfigurationsdatei.babelrc verwenden und welche Vorsichtsmaßnahmen für die Verwendung der vue-clibabel-Konfigurationsdatei.babelrc gelten Das Folgende ist ein praktischer Fall.

In diesem Artikel wird die babelrc-Konfigurationsdatei im Stammverzeichnis des vue-cli-Gerüsttools

vorgestellt Einführung

Browser unterstützen noch nicht alle es6-Funktionen, aber die Verwendung von es6 ist der allgemeine Trend, daher wurde babel ins Leben gerufen, um es6-Code in Code umzuwandeln, den der Browser erkennen kann

Babel bietet ein spezielles Befehlszeilentool zur Erleichterung der Transkodierung. Sie können es selbst kennenlernen

.babelrc-Datei des Vue-Cli-Gerüsts

{
 // 此项指明，转码的规则
 "presets": [
 // env项是借助插件babel-preset-env，下面这个配置说的是babel对es6,es7,es8进行转码，并且设置amd,commonjs这样的模块化文件，不进行转码
 ["env", { "modules": false }],
 // 下面这个是不同阶段出现的es语法，包含不同的转码插件
 "stage-2"
 ],
 // 下面这个选项是引用插件来处理代码的转换，transform-runtime用来处理全局函数和优化babel编译
 "plugins": ["transform-runtime"],
 // 下面指的是在生成的文件中，不产生注释
 "comments": false,
 // 下面这段是在特定的环境中所执行的转码规则，当环境变量是下面的test就会覆盖上面的设置
 "env": {
 // test 是提前设置的环境变量，如果没有设置BABEL_ENV则使用NODE_ENV，如果都没有设置默认就是development
 "test": {
  "presets": ["env", "stage-2"],
  // instanbul是一个用来测试转码后代码的工具
  "plugins": ["istanbul"]
 }
 }
}

ps: Lassen Sie mich Ihnen etwas über die .babelrc-Konfigurationsdatei vorstellen

In Bezug auf die Struktur des React-Projekts gibt es viele Konfigurationsdateien, die manchmal schwer zu verstehen sind.

Beispielsweise wird die .babelrc-Datei zum Festlegen von Transkodierungsregeln und Plug-Ins verwendet.

Wenn Sie mit Linux vertraut sind, müssen Sie wissen, dass Dateien mit der Endung rc normalerweise automatisch geladene Dateien, Konfigurationen usw. während der Laufzeit darstellen. In babel6 ist diese Datei unerlässlich.
Sie können darin Babel-Befehle konfigurieren. Wenn Sie in Zukunft Babels CLI verwenden, können Sie weniger Konfiguration verwenden. Es gibt auch ein env-Feld, das verschiedene Kompilierungsvorgänge für verschiedene Umgebungsvariablen ausführen kann, die durch BABEL_ENV oder NODE_ENV angegeben werden.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der Verwendung von Vuex-Mutationen und -Aktionen

FileReader implementiert eine lokale Vorschau vor dem Hochladen von Bildern

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die vue-clibabel-Konfigurationsdatei.babelrc. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!