Build failed on parcel

Kirby 3 Questions 🤔
6

It’s more complicated cause it’s more than a command line (at least how I’m currently using it - I like the “code over config” approach).
Here’s a snippets from a build script for a plugin:

const path = require('path')
const { rollup, watch: rollupWatch } = require('rollup')

const vuePlugin = require('rollup-plugin-vue')
const { terser } = require('rollup-plugin-terser')
const commonjs = require('@rollup/plugin-commonjs')
const nodeResolve = require('@rollup/plugin-node-resolve')

const entry = [path.join(__dirname, 'src/index.js')]

const inputOptions = {
  input: entry,
  plugins: [
    vuePlugin(),
    nodeResolve,
    commonjs()
  ]
}

const outputOptions = {
  format: 'iife',
  dir: __dirname,
}

async function build() {
  inputOptions.plugins.push(terser())
  const bundle = await rollup(inputOptions)
  await bundle.generate(outputOptions);
  await bundle.write(outputOptions)
  await bundle.close()
}

function watch() {
  const watcher = rollupWatch({
    ...inputOptions,
    output: outputOptions
  })

  watcher.on('event', (event) => {
    if (event.error) {
      console.error(event.error);
    }
    if (event.result) {
      event.result.close();
    }
  });
}

exports.build = build
exports.watch = watch

Only thing is to be careful when choosing the rollup-plugin-vue package version, as the newest version (v6) builds for Vue 3. These are my devDependencies:

  "devDependencies": {
    "@rollup/plugin-commonjs": "^19.0.0",
    "@rollup/plugin-node-resolve": "^13.0.0",
    "rollup": "^2.52.2",
    "rollup-plugin-terser": "^7.0.2",
    "rollup-plugin-vue": "^5.1.9",
  },

plugin-commonjs and plugin-node-resolve are used because I import some stuff from node_modules and those use the “node style” require() imports.
If you’re only doing ES6 imports and don’t require stuff from node_modules, you don’t need those.

This script also does not transcode your javascript with babel since the Kirby panel requirements are anyway rather modern.