前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >rollup快速入门

rollup快速入门

作者头像
跑马溜溜的球
发布2020-12-07 14:36:25
3760
发布2020-12-07 14:36:25
举报
文章被收录于专栏:日积月累1024

1. rollup是什么

Rollup 是一个 JavaScript 模块打包器,可以将小块代码编译成大块复杂的代码。

2. 安装

代码语言:javascript
复制
npm install --global rollup

3. 使用示例

有如下代码,Person.js是独立模块,我们在main.js中使用它。具体代码如下: /src/Person.js

代码语言:javascript
复制
function Person(){
    var name = 'default';

    function setName(n){
        name = n;
    }

    function getName(){
        return name;
    }

    return{
        setName:setName,
        getName:getName
    }
}

export {Person};

/src/main.js

代码语言:javascript
复制
import {Person} from './Person.js';

var p1 = Person();
p1.setName('ball');
console.log(p1.getName());

3.1 命令行打包方式

代码语言:javascript
复制
rollup src/main.js -o index.js -f iife
  • -f 指定输出文件类型:cjs(nodejs使用), iife(浏览器使用), umd(浏览器与nodejs同时使用)
  • -o 输出文件名

3.2 配置文件方式打包

配置文件rollup.config.js

代码语言:javascript
复制
export default {
  input: 'src/main.js',
  output: {
    file: 'index.js',
    format: 'cjs'
  }
};

执行:

代码语言:javascript
复制
rollup -c rollup.config.js
  • -c:配置文件名。不指定时,默认使用文件rollup.config.js。

测试:

代码语言:javascript
复制
node index.js 
ball

4. 参考

  • 更多命令行及配置文件参数,参考这里
  • import, export其实是属于es6的范畴,详细参考这里
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018/06/27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. rollup是什么
  • 2. 安装
  • 3. 使用示例
    • 3.1 命令行打包方式
      • 3.2 配置文件方式打包
      • 4. 参考
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档