找不到.babel和react-hot-loader的正确配置

Question

I'm using babel 7.

In their docs they mention the new naming for plugin is with @babel/ prefix.

React-hot-loader babrlrc config recommendation is:

{
  "plugins": ["react-hot-loader/babel"]
}

my .babelrc config is:

{
  "presets": ["@babel/env", "@babel/react"],
  "env": {
    "development": {
      "plugins": ["@babel/react-hot-loader"]
    },
    "production": {}
  }
}

Is it correct to assume that @babel/react-hot-loader is correct definision?

I could not find any more docs about it.

Answer 1

Saying @babel/react-hot-loader will have babel look within itself for a plugin called react-hot-loader . From what I can tell the package/plugin you're trying to use is not maintained/owned by babel itself. Therefore @babel/react-hot-loader will not work. You should configure your .babelrc as per the documentation of the plugin you're trying to use.

I think this is the plugin you're referring to in your question: react-hot-loader

Follow these setup instructions: react-hot-loader/getting-started

Answer 2

you have to still use it as mentioned in react hot reloader docs. below is the link

https://github.com/gaearon/react-hot-loader#user-content-add-babel-before-typescript

Answer 3

I don't think so, react-hot-loader does not update there docs for prefix definition and I also found there given example https://github.com/gaearon/react-hot-loader/blob/master/examples/typescript/.babelrc

Using babel 7 prefix for other plugins but for react-hot-loader still the same

{ "plugins": [ "@babel/plugin-syntax-typescript", "@babel/plugin-syntax-decorators", "@babel/plugin-syntax-jsx", "react-hot-loader/babel" ] }