Stencil setup: resolve, rollup version

Question

I have two problems, both related to setting up my project.

The ultimate goal is to build some web components that communicate vis OSC using node-osc.

1. My first attempt to set up the project and create a component that uses node-osc resulted in the following message:

   Bundling Warning UNRESOLVED_IMPORT
   'node-osc' is imported by ./src/components/r-channel/r-channel.tsx, but could not be resolved – treating it
   as an external dependency
   

   This gave me a successful build, but my components don't render, so I assume it's not actually all that successful.

2. After some reading, my guess is that I should at least try plugin-node-resolve. I've installed and added to my stencil.config.ts, and am now seeing:

   Rollup: Plugin Error
   Insufficient rollup version: "@rollup/plugin-node-resolve" requires at least [email protected] but found
   [email protected]. (plugin: node-resolve, buildStart)
   

   ...although my package-lock.json seems to indicate that I've got [email protected] installed.

Answer 1

StencilJs has an installation of rollup inside its package and it is outdated, So the rollup package you installed is being ignored. Based on Stencil support they have a lot of customisations on top of current rollup version and they have difficulty updating that package. But they are working on it so the only way is to wait for them to update rollup package. Here is a link to an open issue on their side: https://github.com/ionic-team/stencil/issues/2526