时间戳

首页 > 解决方案 > 使用 webpack 将 javascript 类（如模块节点）导出/导入到电子中

node.js - 使用 webpack 将 javascript 类（如模块节点）导出/导入到电子中

问题描述

在基本的 electon-vue 应用程序的上下文中，我想创建自己的 javascript 类并将其用于主进程或渲染器或 vue 组件。

我创建了 JS 类，但我从来没有找到导出我的类的好方法。

通过相同的错误在网络中找到编写导入/导出模块的所有可能性：未定义的导出

"use strict"

import fs from 'fs'
import typeorm from 'typeorm'
import Public from './../entity/Public'

class ConnectionManager
{
    constructor(){}

    getConnection(type, name, options) {

    }
}

module.exports = ConnectionManager

但似乎其他 js 文件可以像 vue-router js 一样完美地工作，用于路由到 vue.js 应用程序：

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'home',
      component: require('@/components/Home').default
    }
]
})

我用 Webpack 和 libraryTarget 打包我的代码输出是：commonjs2

我似乎将 babel-loader 与 webpack 一起使用

节点版本：10.13.0

电子：3.0.10

巴别塔：6

编辑 ：

我试试这个语法类 js 文件：

"use strict"

import * as fs from 'fs'
import * as typeorm from 'typeorm'
import {Public} from './../entity/Public'

export default class ConnectionManager
{
    constructor(){}

    getConnection(type, name, options) {

    }
}

使用此导入语法：

import ConnectionManager from './../service/connectionManager'

但是当我将代码执行到电子时出现此错误：

未捕获的类型错误：_service_connectionManager__WEBPACK_IMPORTED_MODULE_8__.default.getConnection 不是函数

我控制台记录了这个服务类“ConnectionManager”，我得到了这个结果（所以它确实存在）：

ƒ ConnectionManager() {
    babel_runtime_helpers_classCallCheck__WEBPACK_IMPORTED_MODULE_0___default()(this, ConnectionManager);
}

似乎最终的js模块webpack包含ConnectionManager类

标签： node.jswebpackelectron

解决方案

似乎您以错误的方式将 commonjs 模块与 ES 模块混合在一起。

有很多没有默认导出的模块（包括内置节点） 。要导入这样的模块，您需要使用* as moduleAlias或{ exportedField }在您的导入语句中。尝试通过这种方式重写您的代码：

import * as fs from 'fs'
import * as typeorm from 'typeorm'
import { Public } from '../entity/Public'

export default class ConnectionManager
{
    constructor(){}

    getConnection(type, name, options) {

    }
}

因为这个类是作为默认值导出的，所以可以使用以下构造将其作为默认字段导入，其中 ConnectionManager 是当前作用域的别名：

import ConnectionManager from '../service/connectionManager'

推荐阅读