错误:缺少类属性转换

Question

Error: Missing class properties transform

Test.js:

export class Test extends Component {
  constructor (props) {
    super(props)
  }

  static contextTypes = {
    router: React.PropTypes.object.isRequired
  }

.babelrc:

{
  "presets": ["es2015", "react", "stage-0"],
  "plugins": ["transform-class-properties"]
}

package.json:

"babel-core": "^6.5.1",
"babel-eslint": "^4.1.8",
"babel-loader": "^6.2.2",
"babel-plugin-react-transform": "^2.0.0",
"babel-plugin-transform-class-properties": "^6.5.2",
"babel-preset-es2015": "^6.5.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
"babel-register": "^6.5.2",

我已经浏览了网页并且所有修复都围绕着:升级到babel6,将"stage-0"的顺序切换为"es2015"之后.我所做的一切.

Answer 1

好吧,终于弄明白了,在我的webpack.config.js身上:

module: {
    loaders: [
      {
        test: /\.js?$/,
        exclude: /(node_modules|bower_components)/,
        loaders: [
          'react-hot',
          'babel?presets[]=react,presets[]=es2015,presets[]=stage-0'
        ]
      }
    ]
  }

'babel?presets[]=stage-0,presets[]=react,presets[]=es2015'

必须以同样的方式对待,.babelrc在02015之后切换阶段0并且它完美地编译.

Answer 2

你需要安装babel-plugin-transform-class-properties,就是这样

npm install babel-plugin-transform-class-properties --save-dev

并将以下内容添加到您的.babelrc文件中

"plugins": ["transform-class-properties"] 

Answer 3

以防万一有人实际上仍然面临同样的问题，以下博客文章确实帮助了我：https : //devblogs.microsoft.com/typescript/typescript-and-babel-7/

在我的情况下（babel 7.9.6，typescript 3.9.2，webpack 4.43.0）我必须执行以下操作：

1. 运行以下命令：

   npm install --save-dev @babel/preset-typescript @babel/preset-env @babel/plugin-proposal-class-properties @babel/plugin-proposal-object-rest-spread
   

2. 使用以下内容创建.babelrc文件（是的，我以前没有，它确实工作得很好）：

   {
       "presets": [
           "@babel/env",
           "@babel/preset-typescript"
       ],
       "plugins": [
           "@babel/proposal-class-properties",
           "@babel/proposal-object-rest-spread"
       ]
   }