electron實現(xiàn)讀取和寫入配置文件的示例詳解
一、背景知識
1.1. nodejs內(nèi)置的fs文件系統(tǒng)模塊
1.2. Nodejs中fs文件系統(tǒng)模塊的路徑動態(tài)拼接的問題
Nodejs中fs文件系統(tǒng)模塊的路徑動態(tài)拼接的問題
1.3. process.cwd()方法
用來獲取node命令執(zhí)行時候的文件夾地址
二、如何動態(tài)獲取Electron中配置文件的path?
2.1. __dirname
Node中的__dirname(前面有兩個下劃線)是一個全局變量,用來確定當(dāng)前運(yùn)行的文件所在的目錄。是被執(zhí)行的js文件的目錄。
2.2. process.cwd()
process.cwd()是當(dāng)前執(zhí)行node命令時候的目錄。
2.3. 為什么選擇process.cwd()
兩種方式都可以,一個是當(dāng)前運(yùn)行的文件所在的目錄,一個是node命令時候的目錄,我用的是
process.cwd()
2.4. 不同環(huán)境中的process.cwd()值
我們打印下不同環(huán)境中的
process.cwd()值
/* 執(zhí)行node命令時候的文件夾地址 */
const node_serve_path = process.cwd();
// 讀取配置文件
export function readFile() {
return new Promise((resolve, reject) => {
console.log("node_serve_path----", node_serve_path);
console.log("__dirname---", __dirname);
});
}
2.4.1. 開發(fā)環(huán)境 打印結(jié)果

2.4.2. 打包后不安裝,運(yùn)行/dist_electron/win-unpacked/exe文件

打印結(jié)果

2.4.3. 打包后安裝,運(yùn)行/dist_electron/Setup 0.1.0.exe安裝程序文件

打印結(jié)果

從上面可以看出–這里的文件路徑會根據(jù)環(huán)境不同而變化,我們重點還是放在安裝后的打印結(jié)果,因為
exe肯定都是用來安裝到我們的電腦上面的
三、把配置文件目錄放置到extraResources配置項
3.1. extraResources
extraResources是electron的打包額外資源配置,它允許我們打包安裝后,仍可以訪問并且讀寫配置中的文件目錄
3.2. 按照如下步驟進(jìn)行配置
這是我配置文件的位置

找到vue.config.js,把配置文件目錄配置為extraResourcesextraResources: ["./bin", "./conf"],
pluginOptions: {
electronBuilder: {
// 線上打包環(huán)境,靜態(tài)資源不加載的問題
customFileProtocol: "./",
nodeIntegration: true,
builderOptions: {
productName: "設(shè)備互聯(lián)終端", //項目名,也是生成的安裝文件名 桌面應(yīng)用.exe
/* extraResources在Electron的打包程序安裝完成后,
同樣可以根據(jù)不同的計算機(jī),做一些特殊的配置,
這就需要在Electron中設(shè)置一個配置文件,同時賦予程序?qū)ξ募凶x寫的權(quán)限。
*/
extraResources: ["./bin", "./conf"],
win: {
//win相關(guān)配置
icon: "icon.ico", //圖標(biāo),當(dāng)前圖標(biāo)在根目錄下,注意這里有兩個坑
target: [
{
target: "nsis", //利用nsis制作安裝程序
arch: [
"x64", //64位
],
},
],
},
},
},
},
四、獲取打包后的配置文件路徑
node_serve_path是打包安裝后的process.cwd()打印的結(jié)果

我們順著這個路徑找下去、可以看到有個resources文件夾,這就是electron的額外資源存放的目錄

點開resources發(fā)現(xiàn)了我的配置文件目錄conf

點開conf就是我的配置文件了

既然目錄層級確定了,我們就通過node的path模塊組裝我們的讀寫路徑吧
這里路徑動態(tài)判斷了下–加以區(qū)分一下本地和打包的區(qū)別
/* 執(zhí)行node命令時候的文件夾地址 */ const node_serve_path = process.cwd(); /* 判斷是否是生產(chǎn)環(huán)境 */ const isDev = process.env.NODE_ENV === "development"; /* 需要讀寫的文件地址 */ const file_path = isDev ? path.join(node_serve_path, "/conf/application.properties") : path.join(node_serve_path, "/resources/conf/application.properties");
五、封裝
讀寫完整代碼如下
//引入node原生fs模塊
const fs = require("fs");
// 引入node內(nèi)置的path模塊
const path = require("path");
//引入node原生讀寫配置
const ini = require("ini");
/* 執(zhí)行node命令時候的文件夾地址 */
const node_serve_path = process.cwd();
/* 判斷是否是生產(chǎn)環(huán)境 */
const isDev = process.env.NODE_ENV === "development";
/* 需要讀寫的文件地址 */
const file_path = isDev
? path.join(node_serve_path, "/conf/11application.properties")
: path.join(node_serve_path, "/resources/conf/application.properties");
// 讀取配置文件
export function readFile() {
return new Promise((resolve, reject) => {
fs.readFile(file_path, "utf8", function (err, dataStr) {
if (err) return reject(err.message); //讀取失敗
/* application.properties 文件內(nèi)容符合ini配置文件的格式,
就可以通過ini.parse把讀取到的文件轉(zhuǎn)成js可識別的對象 */
resolve(ini.parse(dataStr.toString()));
});
});
}
// 更改配置文件
export function writeFile(config) {
return new Promise((resolve, reject) => {
fs.writeFile(file_path, ini.stringify(config), function (err) {
if (err) return reject(err.message); //寫入失敗
resolve("寫入成功");
});
});
}
以上就是electron實現(xiàn)讀取和寫入配置文件的示例詳解的詳細(xì)內(nèi)容,更多關(guān)于electron讀取和寫入配置文件的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
使用Object.defineProperty如何巧妙找到修改某個變量的準(zhǔn)確代碼位置
Object.defineProperty() 方法直接在一個對象上定義一個新屬性,或者修改一個已經(jīng)存在的屬性, 并返回這個對象。下面這篇文章主要給大家介紹了關(guān)于使用Object.defineProperty如何巧妙找到修改某個變量的準(zhǔn)確代碼位置的相關(guān)資料,需要的朋友可以參考下2018-11-11
實現(xiàn)超用戶體驗 table排序javascript實現(xiàn)代碼
2009-06-06
javascript中的altKey 和 Event屬性大全
本文給大家介紹javascript中的altkey和event屬性大全,涉及到altkey和event屬性語法定義及用法,本文介紹的非常詳細(xì),感興趣的朋友一起看看吧2015-11-11
不提示直接關(guān)閉網(wǎng)頁窗口的JS示例代碼
本篇文章主要是對不提示直接關(guān)閉網(wǎng)頁窗口的JS示例代碼進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12
JS實現(xiàn)表格數(shù)據(jù)各種搜索功能的方法
這篇文章主要介紹了JS實現(xiàn)表格數(shù)據(jù)各種搜索功能的方法,可實現(xiàn)忽略大小寫,模糊搜索,多關(guān)鍵搜索等功能,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03

