title: ReferenceError: require is not defined for rollup bundle js
body: <p>So, I have been using rollup to bundle my js files, created for usage with three js. What I thought of is to minimize and bundle the three js files using rollup js.
  I used npm and installed three and rollup using the command <code>npm install rollup three</code>.
  The index.js file as created is:</p>
  
  <pre><code>import { Scene, PerspectiveCamera, WebGLRenderer } from 'three'
  
  const scene = new Scene()
  const camera = new PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10)
  camera.position.z = 1
  
  geometry = new BoxGeometry( 0.2, 0.2, 0.2 )
  material = new MeshNormalMaterial()
  
  mesh = new THREE.Mesh( geometry, material )
  const basic = basicScene()
  scene.add( mesh )
  
  const renderer = new WebGLRenderer({antialias: true})
  renderer.setSize( window.innerWidth, window.innerHeight )
  
  document.body.appendChild( renderer.domElement )
  
  function animate() {
    requestAnimationFrame(animate)
  
    mesh.rotation.x += 0.01
    mesh.rotation.y += 0.01
  
    renderer.render( scene, camera )
  }
  
  animate()
  </code></pre>
  
  <p>The rollup config as used is <code>rollup.config.js</code>:</p>
  
  <pre><code>export default [{
    input: 'src/index.js',
    output: {
      file: 'dist/bundle.js',
      format: 'cjs'
    }
  }]
  </code></pre>
  
  <p>The final bundle.js file as generated after running <code>rollup --config</code> is:</p>
  
  <pre><code>'use strict';var three=require('three');const scene = new three.Scene();
  const camera = new three.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10);
  camera.position.z = 1;
  
  geometry = new BoxGeometry( 0.2, 0.2, 0.2 );
  material = new MeshNormalMaterial();
  
  mesh = new THREE.Mesh( geometry, material );
  const basic = basicScene();
  scene.add( mesh );
  
  const renderer = new three.WebGLRenderer({antialias: true});
  renderer.setSize( window.innerWidth, window.innerHeight );
  
  document.body.appendChild( renderer.domElement );
  
  function animate() {
    requestAnimationFrame(animate);
  
    mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.01;
  
    renderer.render( scene, camera );
  }
  
  animate();
  </code></pre>
  
  <p>I have the following doubts with the given bundle.js file that is generated:
  1. The bundle js as created uses <code>require</code>, which results in <code>ReferenceError: require is not defined for rollup</code>
  2. Secondly, not sure why the bundled version is not really the complete minified version of the produced js file?</p>
  
  <p>Great, if some could suggest the probable issue?</p>