予期しないトークンのインポート-Electron / React

kmartmvp

Reactの学習を開始した後でプログラムを実行しようとすると、開始スクリプトを実行したときにこのエラーが発生します。クラス「App」をapp.jsからエントリポイントmain.jsにインポートしています。

以下は私のコードです:

webpack.config.js

module.exports = {
  entry: './main.js',
  target: "electron",
  output: {
    path: './',
    filename: 'app.js'
  },
devServer: {
  inline: true,
  port: 3333
},
module: {
  loaders: [
    {
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['es2015', 'react']
      }
    }
  ]
 }
}

app.js:

const React = require('react');

class App extends React.Component {
    mapboxgl.accessToken = 'key_here';

    render() {
      return (
        <div>
          var map = new mapboxgl.Map({
              container: 'map',
              style: 'map_style_here',
              center: [-74.50, 40],
              zoom: 9
           });
        </div>
      );
    }
}

export default App

main.js:

'use strict';

const React    = require('react');
const ReactDOM = require('react-dom');

import App from './app';

const BrowserWindow = require('browser-window')
const app           = require("app");

var mainWindow = null;     // Keep global reference to main broswer window.

app.on('window-all-closed', function() {
 if (process.platform != 'darwin') {
   app.quit();
 }
});

app.on('ready', function() {

 // Reference the main window object.
 mainWindow = new BrowserWindow({width: 1200, height: 800});

 mainWindow.loadURL('file://' + __dirname + "/app.html")

 mainWindow.on('closed', function() {

 // Dereference the main window object.
 mainWindow = null;

 ReactDOM.render(<App />, document.getElementById('map'))
 })
})

エラー

Uncaught Exception:
SyntaxError: Unexpected token import
  at exports.runInThisContext (vm.js:53:16)
  at Module._compile (module.js:404:25)
  at Object.Module._extensions..js (module.js:432:10)
  at Module.load (module.js:356:32)
  at Function.Module._load (module.js:313:12)
  at loadApplicationPackage  
(C:\Programming\RestaurantChat\node_modules\electron
prebuilt\dist\resources\default_app\main.js:257:23)
  at Object.<anonymous> 
(C:\Programming\RestaurantChat\node_modules\electron
prebuilt\dist\resources\default_app\main.js:289:5)
  at Module._compile (module.js:425:26)
  at Object.Module._extensions..js (module.js:432:10)
  at Module.load (module.js:356:32)

コンパイルされていないものはありますか?なぜ構文エラーがあるのか​​、私は本当に途方に暮れています。

ヴァディムマカゴン

メインのElectronプロセスでReactを使用することはほとんど意味がありません。メインのプロセスは、DOMにアクセスできません。したがって、Reactコンポーネントを文字列にレンダリングし、その結果をIPC経由でレンダラープロセスに送信する計画でない限り、アプローチを再考する必要があります。

についてはSyntaxError、Babelがに変換さimportrequireていないようです変換れるはずなのか、それともWebpackが処理するはずなのかはわかりません。電子レンダラープラグインを使用していますか?電子反応ボイラープレートから始めることをお勧めします。

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ElectronとReactの構文エラー:予期しないトークン

分類Dev

Electronアプリでの予期しないトークンのインポート

分類Dev

[React-Native] [Jest] SyntaxError:予期しないトークンのインポート

分類Dev

Reactコンポーネントの予期しないトークン '='

分類Dev

create-react-appでのテスト中に「予期しないトークンのインポート」

分類Dev

React + Electron:部門のコンポーネントが適切にレイアウトされていません

分類Dev

Reactコンポーネントの予期しないトークン、予期される

分類Dev

React Native:予期しないトークン

分類Dev

React、semantic-ui-react。テストスイートの実行に失敗しました:SyntaxError:予期しないトークンのインポート

分類Dev

React コンポーネントをレンダリングするときの予期しないトークン

分類Dev

新しいreact-nativeプロジェクトを作成する際のエラーとしての「予期しないトークンのインポート」

分類Dev

Node.jsでReactをインポートするとSyntaxErrorがスローされます:予期しないトークンのエクスポート

分類Dev

ReactコンポーネントのJestテスト:予期しないトークン "<"

分類Dev

Reactコンポーネント内からElectronのipcRenderを使用する

分類Dev

ReactとElectron、Chainingイベントハンドラー

分類Dev

React / Reduxエクスポートで予期しないトークン

分類Dev

Electronを使用してReactコンポーネントからファイルダイアログを開く

分類Dev

React Native:予期しないトークンの変換エラー(

分類Dev

componentDidMountの予期しないトークンエラー[React.js]

分類Dev

ブラケット '{'をreactでインポートしようとすると、予期しないトークンになるのはなぜですか?

分類Dev

React Native:位置0のJSONの予期しないトークン

分類Dev

React:予期しないトークンの戻り

分類Dev

React Native 23.1の予期しないトークン(14:6)

分類Dev

React NativeNavigatorの予期しないトークン

分類Dev

Apolloクライアント(React):予期しないエラーの処理

分類Dev

React-予期しないトークン、予期された;

分類Dev

React-予期しないトークン、予期される}

分類Dev

React Redux予期しないトークン、予期される "、"

分類Dev

React Native:予期しないトークン、予期される "、"

Related 関連記事

  1. 1

    ElectronとReactの構文エラー:予期しないトークン

  2. 2

    Electronアプリでの予期しないトークンのインポート

  3. 3

    [React-Native] [Jest] SyntaxError:予期しないトークンのインポート

  4. 4

    Reactコンポーネントの予期しないトークン '='

  5. 5

    create-react-appでのテスト中に「予期しないトークンのインポート」

  6. 6

    React + Electron:部門のコンポーネントが適切にレイアウトされていません

  7. 7

    Reactコンポーネントの予期しないトークン、予期される

  8. 8

    React Native:予期しないトークン

  9. 9

    React、semantic-ui-react。テストスイートの実行に失敗しました:SyntaxError:予期しないトークンのインポート

  10. 10

    React コンポーネントをレンダリングするときの予期しないトークン

  11. 11

    新しいreact-nativeプロジェクトを作成する際のエラーとしての「予期しないトークンのインポート」

  12. 12

    Node.jsでReactをインポートするとSyntaxErrorがスローされます:予期しないトークンのエクスポート

  13. 13

    ReactコンポーネントのJestテスト:予期しないトークン "<"

  14. 14

    Reactコンポーネント内からElectronのipcRenderを使用する

  15. 15

    ReactとElectron、Chainingイベントハンドラー

  16. 16

    React / Reduxエクスポートで予期しないトークン

  17. 17

    Electronを使用してReactコンポーネントからファイルダイアログを開く

  18. 18

    React Native:予期しないトークンの変換エラー(

  19. 19

    componentDidMountの予期しないトークンエラー[React.js]

  20. 20

    ブラケット '{'をreactでインポートしようとすると、予期しないトークンになるのはなぜですか?

  21. 21

    React Native:位置0のJSONの予期しないトークン

  22. 22

    React:予期しないトークンの戻り

  23. 23

    React Native 23.1の予期しないトークン(14:6)

  24. 24

    React NativeNavigatorの予期しないトークン

  25. 25

    Apolloクライアント(React):予期しないエラーの処理

  26. 26

    React-予期しないトークン、予期された;

  27. 27

    React-予期しないトークン、予期される}

  28. 28

    React Redux予期しないトークン、予期される "、"

  29. 29

    React Native:予期しないトークン、予期される "、"

ホットタグ

アーカイブ