rollup.js_Bundle自动更新

问题描述

我正在尝试通过VSCode中的rollup.js进行捆绑。

My directory:

----MyProject
--------\node_modules
-----------\.bin
-----------\rollup
--------index.js
--------index.html
--------bundle.js
--------package-lock.json
--------package.json

在我的.html文件中，我与bundle.js有关联，我在index.js中所做的所有更改都必须在bundle.js中自动更新。但这仅在我在终端中运行以下命令时有效：rollup index.js --file bundle.js

我的package.json：

{
  "name": "npm","version": "1.0.0","description": "","main": "index.js","scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },"author": "","license": "ISC","dependencies": {
    "rollup": "^2.34.2"
  }
}

要使该系统自动运行我需要做什么？

解决方法

首先，我没有配置文件，所以我创建了rollup.config.js：

import serve from 'rollup-plugin-serve'
import livereload from 'rollup-plugin-livereload'

const watch = process.env.ROLLUP_WATCH

export default {
  input: 'src/index.js',output: {
    file: 'dist/bundle.js',format: 'iife'
  },plugins: [
    watch && serve('dist'),watch && livereload()
  ]
}

然后我将这两个脚本添加到package.json中：

"build": "rollup -c","dev": "rollup -c -w"

并在终端npm run dev

中运行

我对vladshcherbin的帮助表示感谢！