在 Angular + Electron 应用程序中使用 better-sqlite3：模块解析失败：意外字符答案

【问题标题】：Using better-sqlite3 in an Angular + Electron app: Module parse failed: Unexpected character在 Angular + Electron 应用程序中使用 better-sqlite3：模块解析失败：意外字符
【发布时间】：2020-06-07 08:22:56
【问题描述】：

在我的Angular + Electron app 中，我正在尝试安装一些 sqlite 库，以便从 sqlite 数据库文件中读取内容。

我已经安装了better-sqlite3 使用：

npm install --save better-sqlite3 
npm install --save-dev @types/better-sqlite3

我已经尝试用它来做：

import * as sqlite from 'better-sqlite3';

// ...

const myDb = sqlite('/path/to/file.sqlite');

但是，当应用程序构建失败时：

./node_modules/better-sqlite3/build/better_sqlite3.node 1:0 中的错误模块解析失败：意外字符 '' (1:0) 您可能需要一个合适的加载器来处理这种文件类型，目前没有加载器配置为处理此文件。看 https://webpack.js.org/concepts#loaders（此处省略源代码二进制文件）./node_modules/integer/build/integer.node 1:0 中的错误模块解析失败：意外字符 '' (1:0) 您可能需要一个合适的加载器来处理这种文件类型，目前没有加载器配置为处理此文件。看 https://webpack.js.org/concepts#loaders（此处省略源代码二进制文件）

看起来我不是第一个在使用 Electron 时遇到这个问题的人。事实上，这个问题已经在here 和here 讨论过，但是我找不到适合我的解决方案。

【问题讨论】：

标签： node.js angular sqlite electron better-sqlite3

【解决方案1】：

你试过用@angular-builders/custom-webpack吗？

npm i @angular-builders/custom-webpack --save-dev

在您的 angular.json 文件中，将其设置在您的架构师下：

"architect": {
  "build": {
    "builder": "@angular-builders/custom-webpack:browser",
    "options": {
      "customWebpackConfig": {
        "path": "./angular.webpack.js"
      },

然后在项目的根目录下添加一个自定义配置文件 angular.webpack.js：

module.exports = {
  externals: {
    'better-sqlite3': "require('better-sqlite3')"
  }
};

【讨论】：