react新手 ，自己搭建的 一个react+webpack 的 helloworld 组件 一直 build错误

Question

求助 ，望各位大佬帮助一下 ，
快崩溃了 、、、、

图片描述

`

Answer 1

新手的话，建议使用create－react－app创建项目，免去你配置的烦恼，webpack配置很复杂，即使有经验的人也很容易遇到各种问题。

Answer 2

{
    test: /\.js$/,
    use: [{
        loader: 'babel-loader',
        options: {
            cacheDirectory: true
        }
    }],
    include: projectRoot,
    exclude: /node_modules/,
}

.babelrc

{
    "presets": [
                ["es2015", { "modules": false }],
                "react",
                "stage-1"
    ],
    "plugins": [
      "transform-decorators-legacy"
    ]
}

Answer 3

报错原因是没办法识别 jsx 的语法，告诉你查看是否需要一个特殊的 loader 进行加载这个文件，但是你的 config 写的配置是适配 webpack@1 版本的。具体可以把 webpack 改成下面的形式试一下：

// webpack.config.js

module: {
    rules: [{
      test: /\.js$/,
      use: [{
          loader: 'babel-loader',
          options: {
              presets: ['env', 'react', 'es2015']
          },
      }],
    }],
},

Answer 4

create react app 才是你需要的
你需要学习的是React
如果想学习项目管理压缩混淆这些，再去搞webpack。他们不是相互依赖的关系，应该独立去学习

Answer 5

你的test: ''这个写的有问题，test配的是一个正则，应该用/regex/包裹,test: /\.js[x]?$/