JSX语法

如何启用JSX语法？

• 安装 babel 插件

  • 运行cnpm i babel-core babel-loader babel-plugin-transform-runtime -D
  • 运行cnpm i babel-preset-env babel-preset-stage-0 -D

• 安装能够识别转换JSX语法的包babel-preset-react

  • 运行cnpm i babel-preset-react -D

• 添加.babelrc 配置文件

{
    "presets":["env","stage-0","react"],
    "plugins":["transform-runtime"]
}

• 添加 babel-loader 配置项

module.exports = {
    mode: "production",  // 'development' or 'production'
    plugins: [htmlPlugin],
    module: { // 所有第三方模块的配置规则
        rules: [ // 第三方匹配规则
            {test: /\.js|jsx$/, use: ['babel-loader'], exclude: /node_module/}
        ]
    }