使用gulp和ES6模块时,Electron&ES6如何实现需要remote/ipc

Question

我正在使用由gulp(browserify/babel)编译的ES6 js文件,ES6文件的示例是:

我有一个普通的App.js用于设置主窗口等.然后html页面将使用main.min.js文件,该文件基本上由编译成一个文件的所有ES6类组成:

loader.es6文件

import Main from  './pages/Main.es6'

new Main()

Main.es6文件

 import Vue from 'vue';

export default class Main extends Vue{
   constructor() {...}
   .....
}

编译和运行时,一切正常,一切都很好......但是我想如果我想实现'IPC','远程'模块,我有编译问题,因为他们找不到那些模块,要么通过require()或 import..我班上的方法.

所以做以下操作失败:

 import Remote from 'remote'
 import Main from  './pages/Main.es6'

 new Main()

要么

var Remote = require('remote')
import Main from  './pages/Main.es6'

new Main()

这有可能做或实现,或者不需要更多的思考并回到正常的js请.

任何想法/建议都会非常感谢

编辑:添加错误详细信息

有问题的示例文件Main.es6

看到var Remote = require('remote')顶部添加的var 会导致以下错误.

甚至使用 import Remote from 'remote'

{ [Error: Cannot find module 'remote' from '/Volumes/DAVIES/ElectronApps/electron-vuejs-starter/resources/js/pages']
 stream:
  { _readableState:
  { highWaterMark: 16,
    buffer: [],
    length: 0,
    pipes: [Object],
    pipesCount: 1,
    flowing: true,
    ended: false,
    endEmitted: false,
    reading: true,
    sync: false,
    needReadable: true,
    emittedReadable: false,
    readableListening: false,
    objectMode: true,
    defaultEncoding: 'utf8',
    ranOut: false,
    awaitDrain: 0,
    readingMore: false,
    decoder: null,
    encoding: null,
    resumeScheduled: false },
   readable: true,
   domain: null,
   _events:
  { end: [Object],
    error: [Object],
    data: [Function: ondata],
    _mutate: [Object] },
  _maxListeners: undefined,
  _writableState:
   { highWaterMark: 16,
    objectMode: true,
    needDrain: false,
    ending: true,
    ended: true,
    finished: true,
    decodeStrings: true,
    defaultEncoding: 'utf8',
    length: 0,
    writing: false,
    corked: 0,
    sync: false,
    bufferProcessing: false,
    onwrite: [Function],
    writecb: null,
    writelen: 0,
    buffer: [],
    pendingcb: 0,
    prefinished: true,
    errorEmitted: false },
  writable: true,
  allowHalfOpen: true,
  _options: { objectMode: true },
  _wrapOptions: { objectMode: true },
   _streams: [ [Object] ],
  length: 1,
   label: 'deps' } }

Answer 1

就我而言,我使用browserify与babelify,如果我尝试:

var remote = require('remote')

我会得到错误:

错误:无法从xxx中找到模块"remote"

但如果我试过

var remote = window.require('remote')

有用.

import remote from 'remote'不起作用,似乎浏览器无法找到未定义的那些本机模块package.json.

Answer 2

玩得很好，我已经设法让它以某种方式工作：

基本上我在 html 页面中设置远程和 ipc 模块，然后将它们传递到该页面的类中。

主要.html

 <script>
   var remote = require('remote');
   var ipc = require('ipc');
   new Main(ipc);
 </script>

Main.js - 类文件

 export default class Main extends Vue{
  constructor(ipc) {
   ....
   ipc.send('listener here','message here');

   .....

可以在此分支中查看这些文件：