Build error on on Node v18 due to native fetch

[duhdugg]

• Provide your rollup config (this is most important, because some plugins changes paths to files)

import commonjs from '@rollup/plugin-commonjs'
import { getBabelOutputPlugin } from '@rollup/plugin-babel'
import { nodeResolve } from '@rollup/plugin-node-resolve'
import postcss from 'rollup-plugin-postcss'
import sucrase from '@rollup/plugin-sucrase'
import external from 'rollup-plugin-peer-deps-external'
import { terser } from 'rollup-plugin-terser'
import pkg from './package.json'
import visualizer from 'rollup-plugin-visualizer'

const plugins = [
  external(),
  nodeResolve(),
  postcss({}),
  sucrase({
    exclude: ['node_modules/**'],
    transforms: ['jsx']
  }),
  commonjs(),
  terser()
]

const cjsConfig = {
  input: 'index.js',
  external: ['prop-types', 'react-quill'],
  output: [
    {
      file: pkg.main,
      format: 'cjs',
      sourcemap: true,
      plugins: [
        getBabelOutputPlugin({
          compact: true,
          presets: [
            [
              '@babel/preset-env',
              {
                modules: 'cjs',
                targets: 'maintained node versions'
              }
            ]
          ]
        })
      ]
    }
  ],
  plugins: plugins.concat([
    visualizer({ filename: 'stats/cjs.html', sourcemap: true, gzipSize: true })
  ])
}

const esmConfig = {
  input: 'index.js',
  external: ['prop-types', 'react-quill'],
  output: [
    {
      file: pkg.module,
      format: 'esm',
      sourcemap: true
    }
  ],
  plugins: plugins.concat([
    visualizer({ filename: 'stats/esm.html', sourcemap: true, gzipSize: true })
  ])
}

const umdOutputGlobals = {
  react: 'React',
  'react-dom': 'ReactDOM',
  'react-dom/server': 'ReactDOMServer',
  'prop-types': 'PropTypes',
  'react-quill': 'ReactQuill',
}
const umdOutputPlugins = [
  getBabelOutputPlugin({
    allowAllFormats: true,
    compact: true,
    presets: [
      [
        '@babel/preset-env',
        {
          modules: 'umd',
          targets: 'defaults'
        }
      ]
    ]
  })
]
const umdConfigs = [
  'Checkbox',
  'Form',
  'Input',
  'Select',
  'Textarea',
  'Wysiwyg'
]
  .map(filename => {
    const createConfig = filename => ({
      input: `src/components/${filename}.jsx`,
      external: ['prop-types', 'react-quill'],
      output: [
        {
          file: `dist/preaction-inputs.${filename.toLowerCase()}.umd.js`,
          format: 'umd',
          globals: umdOutputGlobals,
          sourcemap: true,
          name: `@preaction/inputs-${filename.toLowerCase()}`,
          plugins: umdOutputPlugins
        }
      ],
      plugins: plugins.concat([
        visualizer({
          filename: `stats/${filename.toLowerCase()}.umd.html`,
          sourcemap: true,
          gzipSize: true
        })
      ])
    })
    return createConfig(filename)
  })
  .concat([
    {
      input: 'index.js',
      external: ['prop-types', 'react-quill'],
      output: [
        {
          file: 'dist/preaction-inputs.umd.js',
          format: 'umd',
          globals: umdOutputGlobals,
          sourcemap: true,
          name: '@preaction/inputs',
          plugins: umdOutputPlugins
        }
      ],
      plugins: plugins.concat([
        visualizer({
          filename: 'stats/umd.html',
          sourcemap: true,
          gzipSize: true
        })
      ])
    }
  ])

const rollupConfig = [esmConfig, cjsConfig, ...umdConfigs]
export default rollupConfig

• Provide your node and dependencies versions

node: v18.9.0
@babel/core: 7.19.1
@babel/preset-env: 7.19.1
@rollup/plugin-babel: 5.3.1
@rollup/plugin-commonjs: 22.0.2
@rollup/plugin-node-resolve: 14.1.0
@rollup/plugin-sucrase: 4.0.4
rollup: 2.79.1
rollup-plugin-peer-deps-external: 2.2.4
rollup-plugin-postcss: 4.0.2
rollup-plugin-terser: 7.0.2
rollup-plugin-visualizer: 5.8.1

• Your OS type and version: Arch Linux (rolling)
• Screenshot of problem

[!] (plugin visualizer) Error: You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using SourceMapConsumer
Error: You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using SourceMapConsumer
    at readWasm (/home/doug/Projects/preaction/inputs/node_modules/rollup-plugin-visualizer/node_modules/source-map/lib/read-wasm.js:8:13)
    at wasm (/home/doug/Projects/preaction/inputs/node_modules/rollup-plugin-visualizer/node_modules/source-map/lib/wasm.js:25:16)
    at /home/doug/Projects/preaction/inputs/node_modules/rollup-plugin-visualizer/node_modules/source-map/lib/source-map-consumer.js:264:14
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at Object.generateBundle (/home/doug/Projects/preaction/inputs/node_modules/rollup-plugin-visualizer/dist/plugin/index.js:78:37)

[duhdugg]

Workaround

add NODE_OPTIONS='--no-experimental-fetch' to the environment variables when executing rollup to disable native fetch or downgrade to Node v16-17.

[btd]

Hi,
i have not seen such an issue before. You first one reported it, do you mind providing repro case, that i can just run command and see immediately this error?
It maybe should be reported to source-map issue.

[btd]

I think it is related to this issue mozilla/source-map#432
Basically old versions checks if fetch available

[btd]

I just published fresh patch version, it shoud fix issue with source map package