Rollup构建的Electron应用导入Ramda报错

Question

我正在尝试使用此类堆栈创建一个简单的应用程序（来自 package.json 的带有 lib 版本的代码段）：

"electron": "^5.0.6"
"ramda": "^0.26.1"
"rollup": "^1.17.0",
"rollup-plugin-babel": "^4.3.3",
"rollup-plugin-commonjs": "^10.0.1",
"rollup-plugin-copy-glob": "^0.3.0",
"rollup-plugin-json": "^4.0.0",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-svelte": "^5.1.0",
"svelte": "^3.6.7"

并且偶然发现导入 ramda 库的问题：问题是如果我在电子应用程序的渲染器和主进程中导入 ramda，我会收到以下错误：

Error: Cannot find module './chunk-ae261ffc.js'
Require stack:
- <path>/index.html
    at Module._resolveFilename (internal/modules/cjs/loader.js:659:15)
    at Function.Module._resolveFilename (<path>/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar/common/reset-search-paths.js:43:12)
    at Function.Module._load (internal/modules/cjs/loader.js:577:27)
    at Module.require (internal/modules/cjs/loader.js:715:19)
    at require (internal/modules/cjs/helpers.js:14:16)
    at <path>/dist/renderer.js:3:18

我的汇总配置如下：

export default [
    {
        input: ['src/entries/main.js', 'src/entries/renderer.js'],
        output: {
            dir: 'dist',
            format: 'cjs',
            sourcemap: true
        },
        plugins: [
            svelte({
                css: css => {
                    css.write('dist/svelte.css');
                }
            }),
            resolve(),
            commonjs()
        ],
        external: ['electron', 'child_process', 'fs', 'path', 'url', 'module', 'os']
    }
];

我在渲染器进程（App.svelte 组件）的根组件中使用 ramda：

<script>
    import * as R from 'ramda';

    const q = R.always('hello from svelte');
</script>
{q()}

并且在主进程的入口文件中：

import * as R from 'ramda';

最奇怪的事情（对我来说）是，如果我在上面评论任何 ramda 的导入，那么不会抛出任何错误。否则，我会得到我在这个问题开头描述的错误

更新

在@ScottSauyet 的帮助下，通过将 import 替换为 require 可以清楚地表明它可以正常工作。但我认为这不是一个合适的解决方案（恕我直言，应该更改汇总配置）。

Answer 1

首先，我非常感谢@CliteTailor 的努力。这个回答，大体上是基于他的支持。

问题出在我没有复制到原始问题的片段中。我将我的 index.html 文件留在根文件夹中（它正在渲染器进程中使用）'as-is' - 没有将它与其他编译代码一起复制到 dist 文件夹中并使用了这样的 link 到此文件：

<html>
    <!-- some header -->
    <body>
        <script src='./dist/renderer.js></script>
    </body>
</html>

根据@CliteTailor 的代码，我只是做了一些更改：

1) 添加了 index.html 的复制到 rollup.config.js 中的 dist 文件夹：

export default [
    {
        input: ['src/entries/main.js', 'src/entries/renderer.js'],
        output: {
            dir: 'dist',
            format: 'cjs',
            sourcemap: true
        },
        plugins: [
            svelte({
                css: css => {
                    css.write('dist/svelte.css');
                }
            }),
            resolve(),
            commonjs(),
            copy({
                targets: [{ src: 'index.html', dest: 'dist' }]
            })
        ],
        external: ['electron', 'child_process', 'fs', 'path', 'url', 'module', 'os']
    }
];

2) 替换了从渲染器进程的主文件中调用此 index.html：

// old code
win.loadFile(path.resolve(__dirname, '../index.html'));
// fixed code
win.loadFile(path.resolve(__dirname, 'index.html'));

3) 将 link 更改为 index.html 中的已编译渲染器文件：

<html>
    <!-- some header -->
    <body>
        <script src='./renderer.js></script>
    </body>
</html>

现在一切正常。

Rollup构建的Electron应用导入Ramda报错

Importing Ramda in Electron app builded by Rollup leads to error

javascript

ramda.js

electron

rollupjs

svelte