Rollup
紹介
ただ、CommonsJS方式とESModule方式を混在させるのは無理な模様
インストール
npm install --global rollup
npm install rollup-plugin-node-resolve : npmの内容をimportできるようにする
npm install rollup-plugin-commonjs : CommonsJS方式のimportが書けるようになる
npm install @rollup/plugin-json --save-dev : jsonのrequireを解決する
環境構築
srcフォルダにmain.jsを作成する
code:rollup.config.js
import nodeResolve from 'rollup-plugin-node-resolve'
import cjs from 'rollup-plugin-commonjs'
import json from '@rollup/plugin-json';
export default {
input: 'src/main.js',
output: {
file: 'dist/bundle.js',
format: 'umd',
name: 'bundle'
},
plugins: [
nodeResolve(),
cjs(),
json()
]
}
npx rollup -c で作成
htmlに<script type="text/javascript" src="dist/bundle.js"></script>を追記