修改后：
plugins: [
new VueLoaderPlugin(),
new MiniCssExtractPlugin({filename: 'styles.css'}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: path.resolve(__dirname, '../src/index.ejs'),
templateParameters(compilation, assets, options) {
return {
compilation: compilation,
webpack: compilation.getStats().toJson(),
webpackConfig: compilation.options,
htmlWebpackPlugin: {
files: assets,
options: options
},
process,
};
},
minify: {
collapseWhitespace: true,
removeAttributeQuotes: true,
removeComments: true
},
nodeModules: false
}),
new webpack.DefinePlugin({
'process.env.IS_WEB': 'true'
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin()
],
2、webpack.renderer.config.js
修改前：
修改后：
plugins: [
new VueLoaderPlugin(),
new MiniCssExtractPlugin({filename: 'styles.css'}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: path.resolve(__dirname, '../src/index.ejs'),
templateParameters(compilation, assets, options) {
return {
compilation: compilation,
webpack: compilation.getStats().toJson(),
webpackConfig: compilation.options,
htmlWebpackPlugin: {
files: assets,
options: options
},
process,
};
},
minify: {
collapseWhitespace: true,
removeAttributeQuotes: true,
removeComments: true
},
nodeModules: process.env.NODE_ENV !== 'production'
? path.resolve(__dirname, '../node_modules')
: false
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin()
],
- 运行结果（npm run dev）
让vscode代码提示
当前项目下
cnpm install electron --save
使用 js-cookie
cnpm i js-cookie
打包
npm run build
- 问题一：Error: Unresolved node modules: vue, highcharts,***
解决方案
删除node_modules
使用 npm install (不是使用cnpm会出问题)
- 问题二：electron 打包一直downloading
在 文件夹跟目录下新建文件 .npmrc，内容如下：
electron_mirror=npm.taobao.org/mirrors/ele…
registry=registry.npm.taobao.org
再次进行num run build 速度就会快起来
- 项目的图片资源报错
图片资源不要放在assets中，放在static目录下
path.join(__static, 'yuma.png')
- 左上角的图标不显示
这是build/icons/icon.ico制作的问题，可以选择IconWorkshop软件来制作
- 左上角默认系统名称
在主进程中设置
//设置系统名称（也是初始化左上角名称——项目名称在index.ejs中修改）
app.setName("舆情监控系统")
- 启动时白屏
在主进程中
mainWindow = new BrowserWindow({
height: 800,
useContentSize: true,
width: 1200,
show: false //先隐藏
})
mainWindow.loadURL(winURL)
mainWindow.on('ready-to-show', () => {
mainWindow.show() //初始化后再显示
//右键菜单
require('./model/menu')
//系统托盘
require('./model/tray')
})
注意require引入时要放在mainWindow.show()之后，否则报错
- 点击桌面图标只开启一个应用
在主进程中底部直接添加
const shouldQuit = app.makeSingleInstance((commandLine, workingDirectory) => {
// Someone tried to run a second instance, we should focus our window.
if (mainWindow) {
if (mainWindow.isMinimized()) mainWindow.restore()
mainWindow.focus()
mainWindow.show()
}
})
if (shouldQuit) {
app.quit()
}
- 安装electron-squirrel-startup
npm i electron-squirrel-startup --save
不能使用npm打包会报错
在主进程的最上面添加
if (require('electron-squirrel-startup')) {
app.quit();
}
- nsis配置
"nsis": {
"oneClick": false,
"allowToChangeInstallationDirectory": true,
"allowElevation": true,
"createDesktopShortcut": true,
"createStartMenuShortcut": true
}
读者福利
========
由于篇幅过长，就不展示所有面试题了，想要完整面试题目的朋友（另有小编自己整理的2024大厂高频面试题及答案附赠）
