Skip to content

Instantly share code, notes, and snippets.

@developit
Last active June 29, 2021 15:33
Show Gist options
  • Select an option

  • Save developit/41f088b6294e2591f53b to your computer and use it in GitHub Desktop.

Select an option

Save developit/41f088b6294e2591f53b to your computer and use it in GitHub Desktop.

Revisions

  1. developit renamed this gist Jan 12, 2016. 1 changed file with 0 additions and 0 deletions.
    File renamed without changes.
  2. developit revised this gist Jan 11, 2016. 2 changed files with 27 additions and 34 deletions.
    2 changes: 2 additions & 0 deletions _.md
    Original file line number Diff line number Diff line change
    @@ -3,3 +3,5 @@
    This is an example of how to use [Rollup] with external dependencies, without hard-coding them.

    It reads your installed NPM dependencies and treats them as external to Rollup. They still get bundled, but not as ES2015.

    Make sure you have a `.babelrc` or a `"babel":{}` section in your `package.json`.
    59 changes: 25 additions & 34 deletions rollup.config.js
    Original file line number Diff line number Diff line change
    @@ -4,39 +4,30 @@ import babel from 'rollup-plugin-babel';
    import npm from 'rollup-plugin-npm';
    import commonjs from 'rollup-plugin-commonjs';

    let pkg = JSON.parse(fs.readFileSync('./package.json'));

    let external = Object.keys(pkg.peerDependencies || {}).concat(Object.keys(pkg.dependencies || {}));
    let pkg = JSON.parse(fs.readFileSync('./package.json')),
    external = Object.keys(pkg.dependencies || {}),
    babelRc = pkg.babel || JSON.parse(fs.readFileSync('./.babelrc'));

    export default {
    entry: pkg['jsnext:main'] || 'src/index.js',
    dest: pkg.main,
    sourceMap: path.resolve(pkg.main),
    moduleName: pkg.amdName || pkg.name,
    format: process.env.FORMAT || 'umd', // iife, etc
    external,
    plugins: [
    babel({
    babelrc: false,
    // you could have put the rest of these in a .babelrc:
    // ...JSON.parse(fs.readFileSync('./.babelrc'))
    comments: false,
    exclude: ['node_modules/**', '**/*.css'],
    presets: ['es2015-rollup'],
    plugins: [
    ['transform-es2015-classes', { loose:true }],
    ['transform-object-rest-spread'],
    ['transform-react-jsx', { pragma: 'h' }]
    ]
    }),
    npm({
    jsnext: true,
    main: true,
    skip: external
    }),
    commonjs({
    include: 'node_modules/**',
    exclude: '**/*.css'
    })
    ]
    };
    entry: pkg['jsnext:main'] || 'src/index.js',
    dest: pkg.main,
    sourceMap: path.resolve(pkg.main),
    moduleName: pkg.amdName || pkg.name,
    format: process.env.FORMAT || 'umd',
    external,
    plugins: [
    babel({
    babelrc: false,
    ...babelRc
    }),
    npm({
    jsnext: true,
    main: true,
    skip: external
    }),
    commonjs({
    include: 'node_modules/**',
    exclude: '**/*.css'
    })
    ]
    };
  3. developit created this gist Jan 11, 2016.
    5 changes: 5 additions & 0 deletions _.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,5 @@
    ## Hi!

    This is an example of how to use [Rollup] with external dependencies, without hard-coding them.

    It reads your installed NPM dependencies and treats them as external to Rollup. They still get bundled, but not as ES2015.
    42 changes: 42 additions & 0 deletions rollup.config.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,42 @@
    import path from 'path';
    import fs from 'fs';
    import babel from 'rollup-plugin-babel';
    import npm from 'rollup-plugin-npm';
    import commonjs from 'rollup-plugin-commonjs';

    let pkg = JSON.parse(fs.readFileSync('./package.json'));

    let external = Object.keys(pkg.peerDependencies || {}).concat(Object.keys(pkg.dependencies || {}));

    export default {
    entry: pkg['jsnext:main'] || 'src/index.js',
    dest: pkg.main,
    sourceMap: path.resolve(pkg.main),
    moduleName: pkg.amdName || pkg.name,
    format: process.env.FORMAT || 'umd', // iife, etc
    external,
    plugins: [
    babel({
    babelrc: false,
    // you could have put the rest of these in a .babelrc:
    // ...JSON.parse(fs.readFileSync('./.babelrc'))
    comments: false,
    exclude: ['node_modules/**', '**/*.css'],
    presets: ['es2015-rollup'],
    plugins: [
    ['transform-es2015-classes', { loose:true }],
    ['transform-object-rest-spread'],
    ['transform-react-jsx', { pragma: 'h' }]
    ]
    }),
    npm({
    jsnext: true,
    main: true,
    skip: external
    }),
    commonjs({
    include: 'node_modules/**',
    exclude: '**/*.css'
    })
    ]
    };