如何编写Electron react应用程序入门套件

Question

我正试图用react和electronjs开始我的新项目。我已经安装了带有babel和网络包的react应用程序，效果很好，但现在我很难用电子产品推出它，但没有任何运气：/。我看了很多关于react和electron的文章，但没有关于如何将(react、web pack、babel和electron(连接在一起的建议和实际例子。

electron-starter.js看起来是这样的：

const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;
const path = require('path');
const url = require('url');
const isDev = require('electron-is-dev');
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({width: 900, height: 680});
mainWindow.loadURL(isDev ? 'http://localhost:3000' : `file://${path.join(__dirname, '../build/index.html')}`);
mainWindow.on('closed', () => mainWindow = null);
}
app.on('ready', createWindow);
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (mainWindow === null) {
createWindow();
}
});

和package.json:

{
"name": "hostelpro-app-2",
"version": "0.1.0",
"private": true,
"homepage": "./",
"main": "./electron-starter.js",
"dependencies": {
"react": "^16.4.1",
"react-dom": "^16.4.1",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "webpack-dev-server --open --mode development",
"build": "webpack --mode production",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"electron": "electron .",
"electron-dev": "concurrently "BROWSER=none npm start" "wait-on http://localhost:3000 && electron .""
},
"babel": {
"presets": [
"env"
]
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"css-loader": "^1.0.0",
"electron": "^2.0.6",
"foreman": "^3.0.1",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^3.2.0",
"node-sass": "^4.9.2",
"prop-types": "^15.6.2",
"sass-loader": "^7.1.0",
"style-loader": "^0.21.0",
"webpack": "^4.16.3",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.5"
}
}

现在错误消息是："concurrently"未被识别为内部或外部命令，但如果我从package.json中删除"concurrent"单词，则会发生"BROWSER"未被视为内部或内部命令"错误。

任何建议都会有帮助。谢谢！：(

Answer 1

我为我的问题找到了很好的指导方针，如果有人在寻找答案，请查看此链接-一切都解释得很好，谢谢"Alex Devero">