Help making a plugin webpack-compatible

#1

Hey all,

I’m trying to make this plugin webpack-compatible, https://github.com/burkeholland/nativescript-statusbar, and I’m hitting some issues.

The plugin works fine without webpack, but with webpack enabled I hit this issue.

file:///app/vendor.js:10954:56: JS ERROR Error: Building UI from XML. @file:///app/main-page.xml:11

And that’s about all I have. I’m not sure what’s up here. Are there any obvious tips to make plugins webpack compatible that I’m missing? I removed the .js file from the "main" of this plugin, https://github.com/burkeholland/nativescript-statusbar/commit/6cd74420bbf558a4263648a4c2ef0dba4d64f44a, but that doesn’t seem to have been enough.

Note to test this all you have to do is…

  1. Create a project. tns create foo and cd foo.
  2. Install the plugin. npm install nativescript-statusbar --save
  3. Install webpack. npm install --save-dev nativescript-dev-webpack and npm install.
  4. Run the app. Note that with tns run ios the plugin works fine, but that with tns run ios --bundle the problem occurs.

Any help would be really appreciated. Thanks!

#2

Panayot helped me figure this one out :smile:

The problem is apps that use the plugin must register the plugin’s module in their app/bundle-config.js file. I added a note to the status bar plugin’s README: https://github.com/burkeholland/nativescript-statusbar#webpack.