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がに変換さimport
れrequire
ていないようですが、変換されるはずなのか、それともWebpackが処理するはずなのかはわかりません。電子レンダラープラグインを使用していますか?電子反応ボイラープレートから始めることをお勧めします。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加