今天將會一起討論幾個常用的rollup api

1. rollup.rollup

這裡直接來範例，可開啟之前的範例檔
先在跟目錄增加一個rollup-input-options.js的檔案，並輸入如下

module.exports = {
    input: './src/index.js'
}

再來在跟目錄新增一個rollup-output-options.js的檔案，並輸入如下

module.exports = [{
file: './dist/index-cjs.js',
format: 'cjs',

}, {
file: './dist/index-es.js',
format: 'es',

}, {
file: './dist/index-amd.js',
format: 'amd',

}, {
file: './dist/index-umd.js',
format: 'umd',
name: 'umd', // 指定檔名稱

}]

這樣我們已經將rollup.rollup的輸入輸出路徑設定完了喔，

再來我們還缺甚麼呢????????????

答對了!!!

就是建立來呼叫rollup的api：

所以事不宜遲，我們在跟目錄新增一個rollup-build.js的檔案，並輸入如下

const rollup = require('rollup')
const inputOptions = require('./rollup-input-options')
const outputOptions = require('./rollup-output-options')

async function rollupBuild(input, output) {
  const bundle = await rollup.rollup(input) // 根據input配置進行打包
  console.log(`正在生成：${output.file}`)
  await bundle.write(output) // 根據output配置輸出檔案
  console.log(`${output.file}生成成功！`)
}

(async function () {
  for (let i = 0; i < outputOptions.length; i++) {
    await rollupBuild(inputOptions, outputOptions[i])
  }
})()

使用node rollup-build.js即可編譯喔，這個方法自由度非常的高，個人非常喜歡

裡面有兩個重點api
rollup.rollup(input) bundle.write(output)
由於都是非同步，所以我們可以藉助async機制實現按配置順序依次打包。

介紹了rollup.js的三種打包方式：命令列、配置檔案和API，
再來我們一起討論另一個rollup 的 api，

2. rollup.watch

Rollup 也提供了 rollup.watch 函數，當它檢測到磁盤上單個模塊已經改變，它會重新構建你的文件束。當你通過命令行運行 Rollup，並帶上 --watch 標記時，此函數會被內部使用。

rollup.watch 有兩種主要的使用方式(命令列模式,API模式)，而這裡跟大家提一下命令列模式

• 命令列模式 : 直接在指令檔執行命令後面加--watch ,ex:
  rollup -c rollup.plugin.config.js--watch

總結

下一章我們會了解各種rollup常用的套件，走過路過不要錯過喔

再來各位朋友如果有任何問題 可以到(https://github.com/tp953704/IT-Contest) 有我的範例黨喔!!

參考資料

• rollup官網 (https://rollupjs.org/)
• 10分鐘快速入門rollup.js(https://www.itread01.com/qexxq.html)
• 10分鐘快速進階rollup.js(https://www.itread01.com/qqhkpf.html)
• Rollup打包工具的使用（超詳細，超基礎，附代碼截圖超簡單）rollup（下一代ES模塊捆綁器）(https://juejin.im/post/6844904058394771470)