Javascript MobX装饰程序不工作
我很难让@observable和@computed这样的装饰程序在我的项目中工作 这是我的档案 package.json:Javascript MobX装饰程序不工作,javascript,reactjs,react-native,mobx,mobx-react,Javascript,Reactjs,React Native,Mobx,Mobx React,我很难让@observable和@computed这样的装饰程序在我的项目中工作 这是我的档案 package.json: { "name": "heroku-react", "version": "0.1.0", "private": true, "dependencies": { "babel-plugin-syntax-decorators": "^6.13.0", "mobx": "^3.1.11", "mobx-react": "^4.2.1",
{
"name": "heroku-react",
"version": "0.1.0",
"private": true,
"dependencies": {
"babel-plugin-syntax-decorators": "^6.13.0",
"mobx": "^3.1.11",
"mobx-react": "^4.2.1",
"react": "^15.5.4",
"react-dom": "^15.5.4"
},
"devDependencies": {
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-preset-stage-1": "^6.24.1",
"react-scripts": "1.0.7"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
App.js:
import React, { Component } from 'react';
import './App.css';
import GameBoard from './components/game-board';
import { inject, observer } from 'mobx-react';
class App extends Component {
render() {
return (
<div className="App">
<div className="App-header">
</div>
<GameBoard />
</div>
);
}
}
export default App;
当我在我的类声明之前添加@observer decorator,比如(@observer class App extensed Component{…}),我收到以下错误:
Failed to compile
./src/App.js
Syntax error: Unexpected token (7:0)
5 | import { inject, observer } from 'mobx-react';
6 |
> 7 | @observer class App extends Component {
| ^
8 | render() {
9 | return (
10 | <div className="App">
未能编译
./src/App.js
语法错误:意外标记(7:0)
5 |从“mobx react”导入{inject,observer};
6 |
>7 |@observer类应用程序扩展组件{
| ^
8 | render(){
9 |返回(
10 |
看起来您正在使用创建react app
而没有制作。为了使用装饰器,您应该制作装饰器。或者作为替代品使用。使用创建react app
时安装mobx的正确方法如下
create react app ExampleApp
npm运行弹出
npm安装--saveDev babel插件转换装饰器遗留版
npm安装--保存mobx mobx react
就我而言,我不使用stage-1,但我有以下插件
"plugins": [
"transform-decorators-legacy",
"transform-class-properties"
]
以及package.json中的这些依赖项
"babel": "^6.23.0",
"babel-loader": "^7.1.2",
当您尝试不同的配置时,请确保清除public/packs文件夹。我在缓存文件时遇到了一些问题
"babel": "^6.23.0",
"babel-loader": "^7.1.2",