"Failed to parse source map" - Electron React 应用程序崩溃

Question

我是编码新手。并试图用react制作一个电子应用程序。在应用程序中，我想将用户登录信息保存在应用程序，以便在应用程序启动时自动获取数据。所以，我使用电子设置来保存数据。

代码示例：

app.jsx

...
import setting from "electron-settings";
function App() {
...
useEffect(() => {
const getUser = async () => {
return await setting.get('xpass-user')
}

console.log(getUser());
}, [])

return ...;
}
export default App;

electron.js

const { app, BrowserWindow, ipcMain } = require('electron')
const path = require('path')
const url = require('url')
const isDev = require('electron-is-dev')
function createWindow() {
// Create the browser window.
const win = new BrowserWindow({
width: 1250,
height: 900,
titleBarStyle: "hiddenInset",
autoHideMenuBar: true,
webPreferences: {
nodeIntegration: true,
enableRemoteModule: true,
}
})
win.loadURL(
isDev
? 'http://localhost:3000'
: url.format({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
})
)
win.webContents.openDevTools();
}
app.on('ready',createWindow)
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', function () {
if (BrowserWindow.getAllWindows().length === 0) createWindow()
})

错误：

中的错误/node_modules/electron settings/dist/settings.js 166:27-40

找不到模块：错误：无法解析中的"fs"'C:\Users\learner\app\node_modules\electron settings\dist'

中的错误/node_modules/electron settings/dist/settings.js 170:29-44

找不到模块：错误：无法解析中的"path"'C:\Users\learner\app\node_modules\electron settings\dist'

突破性变化：webpack<5用于包含node.js的polyfill默认情况下为核心模块。现在已经不是这样了。验证您是否需要此模块并为其配置polyfill。

如果你想包括一个polyfill，你需要：

• 添加回退"resolve.fallback:｛"path"require.resolve(">
• 安装"path browserfy"如果你不想包含polyfill，你可以使用一个空模块，如下所示：resolve.fallback:｛"path"false｝

中的错误./node_modules/electronicsettings/node_modules/mkdirp/lib/find-made.js下午3:4-19

找不到模块：错误：无法解析中的"path"'C:\Users\app\node_modules\electron settings\node_modeles\mkdirp\lib'

如果有人能帮我，我将不胜感激。谢谢

Answer 1

找不到模块：错误：无法解析…中的"fs">

In create-react-app, they have stubbed out 'fs'.You cannot import it. They did this because fs is a node core module.
Add the following to the root of the "package.json" file.
"browser": {
"fs": false,
"path": false,
"os": false
}

突破性变化：webpack<5用于默认情况下包括node.js核心模块的polyfill。现在已经不是这样了。验证您是否需要此模块，并为其配置polyfill。

要解决此问题，请检查此问题如何在webpack 5 中填充节点核心模块