merge a third-party dependencies into bundle files is not working

I want to merge the third dependency into the bundle file. According to the configuration of the official website, it does not take effect.
here is my code

rollup.config.js

import resolve from "rollup-plugin-node-resolve";
import commonjs from "rollup-plugin-commonjs";
export default {
  input: "index.js",
  output: {
    file: "main.js",
    format: "iife"
  },
  plugins: [
    resolve({ mainFields: ["jsnext", "module", "main"],
   }),
    commonjs({
      include: "node_modules/**"
    })
  ]
};

index.js

import { CanvasRoot } from "react-webgl";

const cr = new CanvasRoot();

But when I bundle the file, I get thoese information

Here is the bundle file
main.js

(function (reactWebgl) {
	'use strict';

	const cr = new reactWebgl.CanvasRoot();

}(reactWebgl));

This has bothered me for two days,any tips wille be appreciated

Start with the configuration shown in rollup.config.js and the import in index.js, then inspect the generated main.js. Reproduce the bundle and compare the output with the stated goal of including the react-webgl dependency rather than leaving reactWebgl as an external reference.