webpack babel配置

1.webpack.co nfig.jsにbabelを配置する:

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

exclude--検索しないファイルを設定し、梱包速度を最適化する.
include--excludeとは逆に、検索するファイルアドレスを設定します.
パスを絶対的に変換します.
pathの使用はnode.jsから来ています...http://nodejs.cn/api/path.html moduleOptions affecting the normal modules(NormalModuleFactory) これらのオプションは通常のモジュールに影響します.module.loadersAn array of automically appied loaders. 自動ローダーの行列
Each item can have these properties: 各項目にはこれらの属性があります.

test:A condition that must be met  必須条件

exclude:A condition that must not be met 満足できない条件

include:A condition that must be met 必須条件

loader:A string of"!" separated loaders  「!」でloadersを分割する

loaders:An array of loaders as string loadersの文字列配列

2.ルートディレクトリの下で、babellrc.jsファイルを作成し、中にbabelサポートのタイプを置く.

{
    "presets": ["env"]
}

3.依存パッケージのインストール
npm install babel-core--save-dev   //babelのコアバッグ
npm install babel-loader--save-dev  //babelのloaderバッグ
npm install babel-preset-env --save-dev //解析es 6のカバン
npm install babel-preset-react --save-dev //reactのjsxのカバンを解析します.
4.関連資料
webpack中国語文書: https://www.webpackjs.com/
webpack英語の文書: https://webpack.js.org/
babel中国語文書: https://www.babeljs.cn/
babel英語の文書: http://babeljs.io/
node中国語文書:http://nodejs.cn/
node英語の文書:https://nodejs.org/en/
阮一峰のwebpack 16 demos:https://github.com/ruanyf/webpack-demos