title: How to build custom bootstrap bundle using Rollup
body: <p>According to Bootstrap 5 official documentation, we can import pre-compiled js files from <code>bootstrap/js/dist</code> and build a custom bundle using (Webpack, rollup, ...).</p>
  <p><a href="https://getbootstrap.com/docs/5.0/getting-started/javascript/#individual-or-compiled" rel="noreferrer">https://getbootstrap.com/docs/5.0/getting-started/javascript/#individual-or-compiled</a></p>
  <p>And in the optimizing section in docs, they gave an example of how you can import js files.
  <a href="https://getbootstrap.com/docs/5.0/customize/optimize/#lean-javascript" rel="noreferrer">https://getbootstrap.com/docs/5.0/customize/optimize/#lean-javascript</a></p>
  <p><strong>The problem:</strong>
  I created a file named <code>bootstrap.js</code></p>
  <pre><code>import 'bootstrap/js/dist/tooltip';
  </code></pre>
  <p>and I want only to use the <code>Tooltip</code> plugin.
  I use the below configuration for rollup</p>
  <pre><code>  const plugins = [
      babel({
        exclude: 'node_modules/**',
        // Include the helpers in each file, at most one copy of each
        babelHelpers: 'bundled',
        presets: [
          [
            '@babel/preset-env',
            {
              loose: true,
              bugfixes: true,
              modules: false
            }
          ]
        ]
      }),
      nodeResolve()
    ]
  
    const bundle = await rollup.rollup({
      input: './js/vendors/bootstrap.js',
      plugins,
    })
  
    await bundle.write({
      format: 'umd',
      file: './file.js'
    })
  </code></pre>
  <p>After generating the <code>file.js</code> and use an HTML page an error  shows up in the console <code>file.js:1727 Uncaught ReferenceError: process is not defined</code></p>
  <p>Also I can't use bootstrap syntax to initialize the <code>Tooltip</code> plugin
  <code>new bootstrap.Tooltip</code> gives an error of undefined <code>bootstrap</code>.</p>
  <p>I can achieve what I want by import these files from <code>js/src</code> folder and export them as they use in <code>js/src/index.umd.js</code> but following bootstrap official documentation on how to import their plugin seems not to work properly.</p>