电子锻造模板与mobx反应观察员

电子锻造模板与mobx反应观察员

问题描述:

我最近开始玩Electron Forge,我认为这是一个很棒的工具。我也一直在使用mobx-react包进行一些工作,并且一直在使用观察器功能。电子锻造模板与mobx反应观察员

配置基于反应模板电子锻造项目,我修改app.jsx文件看起来像

import React from 'react'; 
import {observer} from 'mobx-react'; 

@observer export default class App extends React.Component { 
    render() { 
    return (<div> 
     <h2>Welcome to React!</h2> 
    </div>); 
    } 
} 

当我运行应用程序它的错误了与

Uncaught SyntaxError: /home/me/project/src/app.jsx: Unexpected token (4:0) 

在哪里第4行是

@observer export default class App extends React.Component { 

从我以前玩过的东西我用了类似w ebpack编译所有东西,使其正常运行。根据项目的description我不需要担心webpack。

如何使用Electron Forge与反应,mobx和观察者功能?

  1. 安装babel-plugin-transform-decorators-legacy包。
  2. transform-decorators-legacytransform-class-properties添加到babel插件。

.compilerc文件的实施例的内容:

{ 
    "env": { 
    "development": { 
     "application/javascript": { 
     "presets": [ 
      ["env", { "targets": { "electron": "1.6.0" } }], 
      "react" 
     ], 
     "plugins": ["transform-decorators-legacy", "transform-class-properties", "transform-async-to-generator", "transform-es2015-classes", "react-hot-loader/babel"], 
     "sourceMaps": "inline" 
     } 
    }, 
    "production": { 
     "application/javascript": { 
     "presets": [ 
      ["env", { "targets": { "electron": "1.6.0" } }], 
      "react" 
     ], 
     "plugins": ["transform-decorators-legacy", "transform-class-properties", "transform-async-to-generator", "transform-es2015-classes"], 
     "sourceMaps": "none" 
     } 
    } 
    } 
}