ejs-electron 无法与 electron-forge 配合使用
2018-09-16
1142
在我的 electron-forge 应用程序中，运行在 Windows 10 上，ejs 模板未呈现，尽管没有显示任何错误。 我可以使用
electron-forge init ejs-test
import { app, BrowserWindow } from 'electron'
import * as ejse from 'ejs-electron'
// Handle creating/removing shortcuts on Windows when installing/uninstalling.
if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
app.quit()
}
// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let mainWindow
const createWindow = () => {
// Create the browser window.
mainWindow = new BrowserWindow({
width: 800,
height: 600,
})
ejse.data('testdata', 'Generated throuh EJS')
// and load the index.html of the app.
mainWindow.loadFile(`${__dirname}/index.ejs`)
// Open the DevTools.
mainWindow.webContents.openDevTools()
// Emitted when the window is closed.
mainWindow.on('closed', () => {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
mainWindow = null
})
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow)
// Quit when all windows are closed.
app.on('window-all-closed', () => {
// On OS X it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
// On OS X it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (mainWindow === null) {
createWindow()
}
})
这是我的 index.ejs 文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<%= testdata %>
</body>
</html>
当我使用 npm start 运行此文件时
我没有收到任何错误，但 <%= testdata %> 按原样显示，而不是被替换。 在加载我的 ejs 文件之前调用 ejse.listening() 返回 true。
同样的代码在非 Forge Electron 应用程序上运行良好。
你能帮忙吗？
经过进一步调查，我发现 ejs-electron 中的关键行
protocol.interceptBufferProtocol('file', protocolListener)
返回了以下错误： 错误：该方案已被拦截
1个回答
这与 https://github.com/electron-userland/electron-forge/issues/291 的问题相同。 由于目前缺乏文档，升级到 electron-forge v6 太困难了，所以我找到了一种解决方法。
我需要使用 ejs 的原因是基于多种语言的消息文件动态生成我的 html 代码。我首先尝试动态生成它并使用带有“data:text/html”协议的 loadURL。但是，这会产生很多问题，因为 html 与文件路径没有关联，因此任何引用都与
因此，我改为在构建时为每种语言生成一个 html 文件，并在运行时根据语言选择要加载的文件。
所以有两个步骤： 我在 package.json 中添加了以下内容：
"scripts": {
"build" : "node build.js"
},
build.js 是：
const ejs = require('ejs')
const fs = require('fs')
let langs = ['en', 'fr']
langs.forEach((lang) => {
let msgdata = JSON.parse(fs.readFileSync(`${__dirname}/src/messages/${lang}.json`, 'utf8'))
ejs.renderFile(`${__dirname}/src/views/pages/mindmap.ejs`,
{
'messages': msgdata,
'otherlanguage': 'fr',
},
{},
(err, str) => {
fs.writeFileSync(`${__dirname}/src/mindmap-${lang}.html`, str, 'utf8')
})
})
因此，npm run build 生成的 html 文件数量与我的语言文件数量一样多。
然后我的应用程序的 index.js 文件几乎就是电子锻造的样板：
const { app, BrowserWindow, ipcMain } = require('electron')
const ejs = require('ejs')
const fs = require('fs')
// 处理在安装/卸载时在 Windows 上创建/删除快捷方式。
if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
app.quit()
}
// 保留窗口对象的全局引用，如果不这样做，窗口将
// 在 JavaScript 对象被垃圾回收时自动关闭。
let mainWindow
const createWindow = () => {
// 创建浏览器窗口。
mainWindow = new BrowserWindow()
// 并加载应用程序的 index.html。
mainWindow.loadURL(`file://${__dirname}/mindmap-${lang}.html`)
// 在窗口关闭时发出。
mainWindow.on('closed', () => {
// 取消引用窗口对象，通常你会将窗口存储在数组中，如果你的应用支持多窗口，此时你应该删除相应的元素。
mainWindow = null
})
}
// 当 Electron 完成初始化并准备好创建浏览器窗口时，将调用此方法。
// 某些 API 只能在此事件发生后使用。
app.on('ready', createWindow)
// 当所有窗口都关闭时退出。
app.on('window-all-closed', () => {
// 在 OS X 上，应用程序及其菜单栏
// 通常会保持活动状态，直到用户使用 Cmd + Q 明确退出
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
// 在 OS X 上，当单击
// 停靠图标且没有其他窗口打开时，通常会在应用程序中重新创建一个窗口。
if (mainWindow === null) {
createWindow()
}
})
// 在此文件中，您可以包含应用程序的其余特定主进程
// 代码。您也可以将它们放在单独的文件中并在此处导入。
ipcMain.on('request-messages', (event, arg) => {
mainWindow.webContents.send('messages', msgdata)
})
Franck Dervaux
2018-09-20