导出
import classNames from './classNames.options'; import editorIcons from './editorIcons.options'; import { browserWindowOption, winURL } from './browser.options'; import shortcutsKeys from './shortcuts.keys'; export { classNames, editorIcons, browserWindowOption, winURL, shortcutsKeys }; 调整background.ts配置完config之后需要再调整一下background.ts
// 修改createWindow方法 function createWindow() { win = new BrowserWindow(browserWindowOption()); if (process.env.WEBPACK_DEV_SERVER_URL) { win.loadURL(process.env.WEBPACK_DEV_SERVER_URL); if (!process.env.IS_TEST) win.webContents.openDevTools(); } else { createProtocol('app'); win.loadURL(winURL); } win.on('closed', () => { win = null; }); } ... app.on('ready', async () => { ... // 快捷键禁用 for (const key of shortcutsKeys) { globalShortcut.register(key, () => {}); } createWindow(); }); vue.config.js 创建vue.config.js文件 /* eslint-disable @typescript-eslint/no-var-requires */ const path = require('path'); module.exports = { productionSourceMap: false, configureWebpack: config => { if (process.env.NODE_ENV !== 'development') {/ // 清除开发中debug和console.log等等 config.optimization.minimizer[0].options.terserOptions.warnings = false; config.optimization.minimizer[0].options.terserOptions.compress = { warnings: false, drop_console: true, drop_debugger: true, pure_funcs: ['console.log'] }; } }, pluginOptions: { // 这里是electronbuild的配置信息 electronBuilder: { // 这里是在浏览器中使用node环境，需要为true nodeIntegration: true, builderOptions: { productName: 'I便笺', appId: 'com.inote.heiyehk', copyright: 'heiyehk', compression: 'store', // "store" | "normal"| "maximum" 打包压缩情况(store 相对较快)，store 39749kb, maximum 39186kb // directories: { // output: 'build' // 输出文件夹 // }, win: { // icon: 'xxx/icon.ico', target: ['nsis', 'zip'] }, mac: { target: { target: 'dir', arch: 'arm64' } }, nsis: { oneClick: false, // 一键安装 // guid: 'xxxx', // 注册表名字，不推荐修改 perMachine: true, // 是否开启安装时权限限制（此电脑或当前用户） allowElevation: true, // 允许请求提升。 如果为false，则用户必须使用提升的权限重新启动安装程序。 allowToChangeInstallationDirectory: true, // 允许修改安装目录 // installerIcon: './build/icons/aaa.ico', // 安装图标 // uninstallerIcon: './build/icons/bbb.ico', // 卸载图标 // installerHeaderIcon: './build/icons/aaa.ico', // 安装时头部图标 createDesktopShortcut: true, // 创建桌面图标 createStartMenuShortcut: true, // 创建开始菜单图标 shortcutName: 'i便笺' // 图标名称 } } }, 'style-resources-loader': { preProcessor: 'less', patterns: [path.resolve(__dirname, 'src/less/index.less')] // 引入全局样式变量 } } }; 使用全局less变量这里需要使用全局less变量，安装style-resources-loader，安装完之后会默认在vue.config.js中配置，只需要修改一下路径即可
vue add style-resources-loader index.less配置 @primary-color: #027aff; @success-color: #19be6b; @warning-color: #ff9900; @error-color: #ed4014; @white-color: #ffffff; @gray-color: #efefef; @text-color: #000000; @text-sub-color: #00000073; @border-color: #d9d9d9; @disabled-color: #c5c8ce; @background-color: #f3f3f3; @background-sub-color: #eeeeee; @shadown-color: #cccccc; // 头部iconsize @headerIconFontSize: 22px; // 头部高度、底部功能按钮和icon的宽高大小是一致的 @iconSize: 40px; .icon { width: @iconSize; height: @iconSize; min-width: @iconSize; min-height: @iconSize; outline: none; border: none; background-color: transparent; padding: 0; position: relative; &::before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; } a { color: initial; width: 100%; height: 100%; outline: none; position: relative; z-index: 1; } .iconfont { width: 22px; position: relative; } &:hover { &::before { background-color: rgba(0, 0, 0, 0.1); } } }