Babel構成の不完全なガイドライン

Babel 7.1.0アップグレードの注意事項
廃棄年presetbabel-preset-es2015または他の年を手動でインストールする必要はありません.@babel/preset-envをインストールすればいいです.最新バージョンのjavascriptを使用することに相当します.
廃棄ステージpresetstage-0などのステージ構成を使用しない@と-の違い
これは実際にはnpmに関する知識であり、babelに限られない.babelをインストールするいくつかのプリセットには、node_modulesフォルダに直接インストールし、単独のnpmパッケージとして使用する2つの方法がある.

cnpm install babel-preset-env --save

もう1つはscoped packageのインストールです

cnpm install @babel/preset-env --save

どちらの方法も間違っていませんが、パスの問題に注意してpresetの作成を参照してください.
Presetsプリセット
1つのプラグインセットに相当し、一連のプリセットを提供することによって翻訳機能を実現する.よく使われるものは次のとおりです.

@babel/preset-react:JSX構文をコンパイルするための

@babel/preset-env:インテリジェントな構文環境プリセットで、構文変換(stage-0に取って代わるなど)

を詳細に構成する必要はありません.
presetの作成
babelrcを例に選択します.構文は次のとおりです.

{
    "presets":["@babel/preset-env"]
}

scoped-packageモードを採用していない場合は、あなたの書き方は

{
    "presets":["babel-preset-env"]
}

略して

{
    "presets":["env"]
}

Plugins
プラグインの動作はpresets以前であり、初級ユーザとしてプラグインはまだ使用されていないが、基本的にはpresetsを使用してプラグインセットをバカに提供すれば十分である.詳細はスタンプを押してください:Plugins|Babel中国語ネット
.babelrcファイル作成
babelを構成する方法はいくつかありますが、最も便利なのは.babelrcファイルを作成することです.公式には、このファイルはどこに置いてもいいと言われています.babel-loaderは再帰的なパスを探していますが、実際に一度試してみるとだめのようです.もちろん、これは私が処理していない可能性があります.とにかく、ルートディレクトリに置くことをお勧めします.
その後、@babel/coreをインストールして、すべての翻訳がプロファイルで行われていることを確認する必要があります.
≪インスタンス｜Instance｜emdw≫reactのプロジェクトです

package.jsonファイル、つまりインストールする必要があります:

{
  ...
    "dependencies": {
    "@babel/core": "^7.1.2",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.4",
    ...
    }
    ...
}

.babelrcファイルは簡単です:

{
  "presets": ["@babel/preset-env","@babel/preset-react"]
}

webpack.config.jsファイル:

{
...
module: {
        rules: [
            {
                test: /\.js$/,
                exclude: path.resolve(__dirname,'..','node_modules'),
                use: {
                    loader: "babel-loader",
                }
            },
            ...]
        }
        ...
}