【问题标题】:Using LowDB on Electron APP在 Electron APP 上使用 LowDB
【发布时间】:2016-08-09 20:57:22
【问题描述】:

我正在开发一个使用 Electron 和 AngularJS 制作的基本应用程序。为此,我使用电子样板 (https://github.com/szwacz/electron-boilerplate),对于数据库,我使用 LowDB(https://github.com/typicode/lowdb)。

我已经能够创建一个数据库 (JSON) 并从脚本中读取它。但我的问题是当我想更新和保存时。我可以更新,并且更改会反映在 JSON 文件上,但是当我再次启动应用程序时,JSON 具有与开始时相同的数据(被覆盖)。

我认为这是 Electron 样板的构建任务的问题,它总是覆盖文件。我以为当我完成发布应用程序的任务时,它会修复(npm run release),但不会,它会覆盖 json。

我正在加载数据库:

import low from 'lowdb';
import storage from 'lowdb/file-sync';
import {
    remote
}
from 'electron';
var fs = require('fs');

var app = remote.require('app');

const db = low(__dirname + '/db.json', {
    storage
});

document.addEventListener('DOMContentLoaded', function() {

db('users').push({
    'name': 'foo'
});

});

此脚本在开始时加载,因此每次启动该应用程序时都应添加一个新条目。该脚本正在 JSON 文件中写入新条目,但当重新启动时,JSON 会恢复到以前的状态。

最后我用的是localStorage,但是我想用LowDB把数据保存在本地。

这是我之前评论过的关于构建应用程序的任务(gulp 文件):

'use strict';

var pathUtil = require('path');
var Q = require('q');
var gulp = require('gulp');
var sass = require('gulp-sass');
var watch = require('gulp-watch');
var batch = require('gulp-batch');
var plumber = require('gulp-plumber');
var jetpack = require('fs-jetpack');

var bundle = require('./bundle');
var generateSpecImportsFile = require('./generate_spec_imports');
var utils = require('../utils');

var projectDir = jetpack;
var srcDir = projectDir.cwd('./app');
var destDir = projectDir.cwd('./build');

var paths = {
    copyFromAppDir: [
        './node_modules/**',
        './bower_components/**',
        './components/**',
        './scripts/**',
        './shared.services/**',
        './sections/**',
        './helpers/**',
        './db.json',
        './**/*.html',
        './**/*.+(jpg|png|svg|eot|ttf|woff|woff2)'
    ],
}

// -------------------------------------
// Tasks
// -------------------------------------

gulp.task('sass', ['clean'], function() {
    console.log('Compiling SASS...');
    gulp.src('app/styles/scss/main.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest(destDir.path('styles')));
});

gulp.task('watch:sass', function() {
    console.log('Watching SASS...');
    var sassWatcher = gulp.watch(['app/styles/scss/*.scss','app/**/**/*.scss'], ['sass']);

    sassWatcher.on('change', function(event) {
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
    });
gulp.src('app/styles/scss/main.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest(destDir.path('styles')));
});


gulp.task('clean', function (callback) {
    return destDir.dirAsync('.', { empty: true });
});


var copyTask = function () {
    return projectDir.copyAsync('app', destDir.path(), {
            overwrite: true,
            matching: paths.copyFromAppDir
        });
};
gulp.task('copy', ['clean'], copyTask);
gulp.task('copy-watch', copyTask);


var bundleApplication = function () {
    return Q.all([
            bundle(srcDir.path('background.js'), destDir.path('background.js')),
            bundle(srcDir.path('app.js'), destDir.path('app.js')),
            bundle(srcDir.path('script.js'), destDir.path('script.js')),
        ]);
};

var bundleSpecs = function () {
    return generateSpecImportsFile().then(function (specEntryPointPath) {
        return bundle(specEntryPointPath, destDir.path('spec.js'));
    });
};

var bundleTask = function () {
    if (utils.getEnvName() === 'test') {
        return bundleSpecs();
    }
    return bundleApplication();
};
gulp.task('bundle', ['clean'], bundleTask);
gulp.task('bundle-watch', bundleTask);




gulp.task('finalize', ['clean'], function () {
    var manifest = srcDir.read('package.json', 'json');

    // Add "dev" or "test" suffix to name, so Electron will write all data
    // like cookies and localStorage in separate places for each environment.
    switch (utils.getEnvName()) {
        case 'development':
            manifest.name += '-dev';
            manifest.productName += ' Dev';
            break;
        case 'test':
            manifest.name += '-test';
            manifest.productName += ' Test';
            break;
    }

    // Copy environment variables to package.json file for easy use
    // in the running application. This is not official way of doing
    // things, but also isn't prohibited ;)
    manifest.env = projectDir.read('config/env_' + utils.getEnvName() + '.json', 'json');

    destDir.write('package.json', manifest);
});


gulp.task('watch', function () {
    watch('app/**/*.js', batch(function (events, done) {
        gulp.start('bundle-watch', done);
    }));
    watch(paths.copyFromAppDir, { cwd: 'app' }, batch(function (events, done) {
        gulp.start('copy-watch', done);
    }));
    watch('app/**/scss/*.scss', batch(function (events, done) {
        gulp.start('watch:sass', done);
    }));
    watch('app/**/**/*.scss', batch(function (events, done) {
        gulp.start('watch:sass');
    }));
});


gulp.task('build', ['bundle', 'sass', 'copy', 'finalize']);

你怎么看,在'copyFromAppDir'中有一个db.json。此文件是我的数据库,但我想更新它并且更改会持续存在,但我无法做到。

亲切的问候!

【问题讨论】:

    标签: angularjs json node.js gulp electron


    【解决方案1】:

    看起来您的 gulp 任务“清理”正在覆盖您的 db.json 文件。因为您使用的是lowDB,所以这与覆盖数据库相同。如果您从 'copyFromAppDir' 数组中删除行 './db.json',,则更改应保持不变。

    像这样:

    var paths = {
        copyFromAppDir: [
            './node_modules/**',
            './bower_components/**',
            './components/**',
            './scripts/**',
            './shared.services/**',
            './sections/**',
            './helpers/**',
            './**/*.html',
            './**/*.+(jpg|png|svg|eot|ttf|woff|woff2)'
        ],
    }
    

    【讨论】:

    • 感谢您回答@Josh,但如果我从那里删除 db.json,构建应用程序的任务将无法找到 db.json,然后它将为空。我可以填写它,但是当启动应用程序时,它再次找不到文件并会创建一个新文件,但为空
    猜你喜欢
    • 2022-06-23
    • 2019-10-25
    • 2018-09-21
    • 2019-03-04
    • 2021-06-30
    • 1970-01-01
    • 2018-01-14
    • 1970-01-01
    • 2019-11-09
    相关资源
    最近更新 更多