加密缺少全局变量名答案

【问题标题】：crypto missing global variable name加密缺少全局变量名
【发布时间】：2020-10-20 20:11:31
【问题描述】：

我必须将一个组件从 svelte-sapper 移动到 sapper。组件就是这样使用uuid的

import { v4 as uuidv4} from uuid

我还安装了加密。当我在控制台浏览器上使用该组件时出现此错误

rng.js:4 未捕获的类型错误：crypto.randomFillSync 不是函数

在控制台上：

bundles src/index.js → dist/index.mjs, dist/index.js, public/build/bundle.js...
(!) Missing global variable names
Use output.globals to specify browser global variable names corresponding to external modules
crypto (guessing 'crypto')
crypto (guessing 'crypto')

我已经用 npm 安装了 crypto，这个函数在 bundle.js 上

const rnds8 = new Uint8Array(16); function rng() { return crypto.randomFillSync(rnds8); }

我看到我需要在 rollup.config.js 内部，在插件元素内部使用

resolve({ browser: true }),

但它没有工作。有什么建议吗？

这是我的汇总

import svelte from 'rollup-plugin-svelte';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import pkg from './package.json';

const production = !process.env.ROLLUP_WATCH;

const name = pkg.name
    .replace(/^(@\S+\/)?(svelte-)?(\S+)/, '$3')
    .replace(/^\w/, m => m.toUpperCase())
    .replace(/-\w/g, m => m[1].toUpperCase());

export default {
    input: 'src/index.js',
    output: [
        { file: pkg.module, 'format': 'es' },
        { file: pkg.main, 'format': 'umd', name },
        {
            sourcemap: true,
            format: 'iife',
            name: 'app',
            file: 'public/build/bundle.js'
        }
    ],
    plugins: [
        svelte({
            // enable run-time checks when not in production
            dev: !production,
            // we'll extract any component CSS out into
            // a separate file - better for performance
            css: css => {
                css.write('public/build/bundle.css');
            }
        }),
        resolve({
            browser: true
        }),
        commonjs(),
        // In dev mode, call `npm run start` once
        // the bundle has been generated
        !production && serve()
    ]
};

function serve() {
    let started = false;

    return {
        writeBundle() {
            if (!started) {
                started = true;

                require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], {
                    stdio: ['ignore', 'inherit', 'inherit'],
                    shell: true
                });
            }
        }
    };
}

【问题讨论】：

在默认的 Svelte 模板中，如果我从 resolve 插件中删除 browser: true，我会得到与您完全相同的错误。否则它就可以正常工作，根本不需要更改配置。所以我认为你的选择没有被考虑到（错字？）......你能发布你的rollup.config.js吗？
我在主页上发布了我的汇总
嗯...仍然可以通过将配置复制粘贴到新克隆的 Svelte 模板中来工作，无需更改。你不需要为此安装crypto 包。不知道为什么它不适合你：-/

标签： javascript cryptography uuid svelte svelte-component

【解决方案1】：

我遇到了和你一样的错误。通过添加解决它

import nodePolyfills from 'rollup-plugin-node-polyfills';

然后添加

nodePolyfills(),
resolve({
  browser: true,
})

这为我删除了警告

【讨论】：