So konfigurieren Sie die Babel-Konfigurationsdatei in vue-cli

Babel ist ein weit verbreiteter Transcoder, der ES6-Code in ES5-Code konvertieren kann, sodass er in der vorhandenen Umgebung ausgeführt werden kann. In diesem Artikel wird die babelrc-Konfigurationsdatei im Stammverzeichnis des vue-cli-Gerüsttools vorgestellt

Dieser Artikel stellt die babelrc-Konfigurationsdatei im Stammverzeichnis des vue-cli-Gerüsttools vor

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 zu konvertieren in Code, den der Browser erkennen kann.

babel bietet ein spezielles Befehlszeilentool, um die Transkodierung zu erleichtern. Sie können sich selbst über die .babelrc-Datei von

vue-cli scaffolding informieren.

{
 // 此项指明，转码的规则
 "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 die .babelrc-Konfigurationsdatei vorstellen

In Bezug auf die React-Projektstruktur gibt es viele Konfigurationsdateien, und manchmal ist dies auch der Fall schwer zu verstehen.

Zum Beispiel die .babelrc-Datei. Diese Datei wird zum Festlegen von Transkodierungsregeln und Plug-Ins verwendet.

Wenn Sie mit Linux vertraut sind, müssen Sie wissen, dass Dateien, die auf rc enden, normalerweise Dateien, Konfigurationen usw. darstellen, die zur Laufzeit automatisch geladen werden. 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 habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

Erklären Sie im Detail die praktischen Fähigkeiten in Immutable und React

So lösen Sie das Fehlerproblem im VUEX-kompatiblen IE (Ausführliches Tutorial)

So verwenden Sie readline in Node.js, um Dateiinhalt Zeile für Zeile zu lesen und zu schreiben

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