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",
Ho setacciato il web e tutte le correzioni ruotano attorno a: Upgrade a babel6, cambiando l’ordine di “stage-0” dopo “es2015”. Tutto ciò che ho fatto.
OK, finalmente ho capito, nel mio webpack.config.js
ho avuto:
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
trattato allo stesso modo di .babelrc
, lo stage-0 passato deve essere dopo es2015 e viene compilato perfettamente.
Devi installare babel-plugin-transform-class-properties
, ovvero
npm install babel-plugin-transform-class-properties --save-dev
e aggiungi quanto segue al tuo file .babelrc
"plugins": ["transform-class-properties"]
Ho avuto questo errore perché stavo usando lo stage-3
invece dello stage-0
.
@speak ha ragione, ma è necessario modificare l’ordine
loaders: [ 'react-hot', 'babel?presets[]=react,presets[]=es2015,presets[]=stage-0' ]
Ho anche riscontrato questo errore a causa dell’uso di preset di env: "presets": [ "react", "es2015", "stage-0", ["env", { "modules": false }]],
e dopo I rimuovere i preset di env, funziona bene
Ho incontrato lo stesso problema usando la vista koa-react . Lasciati ispirare da queste risposte e alla fine lo koa server.js
con il seguente codice nel koa server.js
:
const register = require('babel-register'); register({ presets: ['es2015', 'react', 'stage-0'], extensions: ['.jsx'] });