Unable to update to latest react-msaview

[cmdcolin]

Example change https://github.com/GMOD/jbrowse-plugin-msaview/compare/update_react_msaview?expand=1

The change to src/index.ts is not needed, but demonstrates that it receives a value of MSA undefined, and it is due to react-msaview being categorized as a external dependency

Example log if I add JSON.stringify in the tsdx.config.js

yarn start
yarn run v1.22.10
$ tsdx watch --verbose --noClean --format umd --name JBrowsePluginMsaView --onFirstSuccess "serve --cors --listen 9000 ."
{
  "input": "/home/cdiesh/src/jbrowse-plugin-msaview/src/index.ts",
  "treeshake": {
    "propertyReadSideEffects": false
  },
  "output": {
    "file": "/home/cdiesh/src/jbrowse-plugin-msaview/dist/jbrowse-plugin-msaview.umd.development.js",
    "format": "umd",
    "freeze": false,
    "esModule": true,
    "name": "JBrowsePluginMsaView",
    "sourcemap": true,
    "globals": {
      "react": "JBrowseExports.react",
      "react-native": "ReactNative",
      "mobx": "JBrowseExports.mobx",
      "mobx-state-tree": "JBrowseExports.mobx-state-tree",
      "react-dom": "JBrowseExports.react-dom",
      "mobx-react": "JBrowseExports.mobx-react",
      "prop-types": "JBrowseExports.prop-types",
      "@material-ui/core": "JBrowseExports.@material-ui/core",
      "@material-ui/core/SvgIcon": "JBrowseExports.@material-ui/core/SvgIcon",
      "@material-ui/core/utils": "JBrowseExports.@material-ui/core/utils",
      "@material-ui/lab": "JBrowseExports.@material-ui/lab",
      "@material-ui/data-grid": "JBrowseExports.@material-ui/data-grid",
      "@jbrowse/core/Plugin": "JBrowseExports.@jbrowse/core/Plugin",
      "@jbrowse/core/pluggableElementTypes/ViewType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/ViewType",
      "@jbrowse/core/pluggableElementTypes/AdapterType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/AdapterType",
      "@jbrowse/core/pluggableElementTypes/DisplayType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/DisplayType",
      "@jbrowse/core/pluggableElementTypes/TrackType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/TrackType",
      "@jbrowse/core/pluggableElementTypes/WidgetType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/WidgetType",
      "@jbrowse/core/pluggableElementTypes/models": "JBrowseExports.@jbrowse/core/pluggableElementTypes/models",
      "@jbrowse/core/pluggableElementTypes/renderers/ServerSideRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/ServerSideRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/CircularChordRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/CircularChordRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/RendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/RendererType",
      "@jbrowse/core/configuration": "JBrowseExports.@jbrowse/core/configuration",
      "@jbrowse/core/util/types/mst": "JBrowseExports.@jbrowse/core/util/types/mst",
      "@jbrowse/core/ui": "JBrowseExports.@jbrowse/core/ui",
      "@jbrowse/core/util": "JBrowseExports.@jbrowse/core/util",
      "@jbrowse/core/util/color": "JBrowseExports.@jbrowse/core/util/color",
      "@jbrowse/core/util/tracks": "JBrowseExports.@jbrowse/core/util/tracks",
      "@jbrowse/core/util/Base1DViewModel": "JBrowseExports.@jbrowse/core/util/Base1DViewModel",
      "@jbrowse/core/util/io": "JBrowseExports.@jbrowse/core/util/io",
      "@jbrowse/core/util/mst-reflection": "JBrowseExports.@jbrowse/core/util/mst-reflection",
      "@jbrowse/core/util/rxjs": "JBrowseExports.@jbrowse/core/util/rxjs",
      "@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail": "JBrowseExports.@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail",
      "@jbrowse/core/data_adapters/BaseAdapter": "JBrowseExports.@jbrowse/core/data_adapters/BaseAdapter"
    },
    "exports": "named"
  },
  "plugins": [
    false,
    {
      "name": "node-resolve"
    },
    {
      "name": "commonjs"
    },
    {
      "name": "json"
    },
    {},
    {
      "name": "rpt2"
    },
    {
      "name": "babel"
    },
    {
      "name": "replace"
    },
    {
      "name": "sourcemaps"
    },
    false
  ]
}
{
  "input": "/home/cdiesh/src/jbrowse-plugin-msaview/src/index.ts",
  "treeshake": {
    "propertyReadSideEffects": false
  },
  "output": {
    "file": "/home/cdiesh/src/jbrowse-plugin-msaview/dist/jbrowse-plugin-msaview.umd.production.min.js",
    "format": "umd",
    "freeze": false,
    "esModule": true,
    "name": "JBrowsePluginMsaView",
    "sourcemap": true,
    "globals": {
      "react": "JBrowseExports.react",
      "react-native": "ReactNative",
      "mobx": "JBrowseExports.mobx",
      "mobx-state-tree": "JBrowseExports.mobx-state-tree",
      "react-dom": "JBrowseExports.react-dom",
      "mobx-react": "JBrowseExports.mobx-react",
      "prop-types": "JBrowseExports.prop-types",
      "@material-ui/core": "JBrowseExports.@material-ui/core",
      "@material-ui/core/SvgIcon": "JBrowseExports.@material-ui/core/SvgIcon",
      "@material-ui/core/utils": "JBrowseExports.@material-ui/core/utils",
      "@material-ui/lab": "JBrowseExports.@material-ui/lab",
      "@material-ui/data-grid": "JBrowseExports.@material-ui/data-grid",
      "@jbrowse/core/Plugin": "JBrowseExports.@jbrowse/core/Plugin",
      "@jbrowse/core/pluggableElementTypes/ViewType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/ViewType",
      "@jbrowse/core/pluggableElementTypes/AdapterType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/AdapterType",
      "@jbrowse/core/pluggableElementTypes/DisplayType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/DisplayType",
      "@jbrowse/core/pluggableElementTypes/TrackType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/TrackType",
      "@jbrowse/core/pluggableElementTypes/WidgetType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/WidgetType",
      "@jbrowse/core/pluggableElementTypes/models": "JBrowseExports.@jbrowse/core/pluggableElementTypes/models",
      "@jbrowse/core/pluggableElementTypes/renderers/ServerSideRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/ServerSideRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/CircularChordRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/CircularChordRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType",
      "@jbrowse/core/pluggableElementTypes/renderers/RendererType": "JBrowseExports.@jbrowse/core/pluggableElementTypes/renderers/RendererType",
      "@jbrowse/core/configuration": "JBrowseExports.@jbrowse/core/configuration",
      "@jbrowse/core/util/types/mst": "JBrowseExports.@jbrowse/core/util/types/mst",
      "@jbrowse/core/ui": "JBrowseExports.@jbrowse/core/ui",
      "@jbrowse/core/util": "JBrowseExports.@jbrowse/core/util",
      "@jbrowse/core/util/color": "JBrowseExports.@jbrowse/core/util/color",
      "@jbrowse/core/util/tracks": "JBrowseExports.@jbrowse/core/util/tracks",
      "@jbrowse/core/util/Base1DViewModel": "JBrowseExports.@jbrowse/core/util/Base1DViewModel",
      "@jbrowse/core/util/io": "JBrowseExports.@jbrowse/core/util/io",
      "@jbrowse/core/util/mst-reflection": "JBrowseExports.@jbrowse/core/util/mst-reflection",
      "@jbrowse/core/util/rxjs": "JBrowseExports.@jbrowse/core/util/rxjs",
      "@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail": "JBrowseExports.@jbrowse/core/BaseFeatureWidget/BaseFeatureDetail",
      "@jbrowse/core/data_adapters/BaseAdapter": "JBrowseExports.@jbrowse/core/data_adapters/BaseAdapter"
    },
    "exports": "named"
  },
  "plugins": [
    false,
    {
      "name": "node-resolve"
    },
    {
      "name": "commonjs"
    },
    {
      "name": "json"
    },
    {},
    {
      "name": "rpt2"
    },
    {
      "name": "babel"
    },
    {
      "name": "replace"
    },
    {
      "name": "sourcemaps"
    },
    {
      "name": "terser"
    }
  ]
}
⠋ @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
⠙ Compiling modules...Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-property-in-object.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-property-in-object.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.
⠹ Compiling modules...'react-msaview' is imported by src/index.ts, but could not be resolved – treating it as an external dependency
No name was provided for external module 'react-msaview' in output.globals – guessing 'MSA'
⠸ Compiling modules...@rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-property-in-object.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-property-in-object since the "loose" mode option was set to "true" for @babel/plugin-proposal-class-properties.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
to the "plugins" section of your Babel config.
Though the "loose" option was set to "false" in your @babel/preset-env config, it will not be used for @babel/plugin-proposal-private-methods since the "loose" mode option was set to "true" for @babel/plugin-proposal-private-property-in-object.
The "loose" option must be the same for @babel/plugin-proposal-class-properties, @babel/plugin-proposal-private-methods and @babel/plugin-proposal-private-property-in-object (when they are enabled): you can silence this warning by explicitly adding
        ["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.
⠼ Compiling modules...'react-msaview' is imported by src/index.ts, but could not be resolved – treating it as an external dependency
No name was provided for external module 'react-msaview' in output.globals – guessing 'MSA'
✔ Compiled successfully

  Watching for changes

UPDATE AVAILABLE The latest version of `serve` is 12.0.0

   ┌──────────────────────────────────────────────────┐
   │                                                  │
   │   Serving!                                       │
   │                                                  │
   │   - Local:            http://localhost:9000      │
   │   - On Your Network:  http://192.168.0.18:9000   │
   │                                                  │
   │   Copied local address to clipboard!             │
   │                                                  │
   └──────────────────────────────────────────────────┘

Key line

Compiling modules...'react-msaview' is imported by src/index.ts, but could not be resolved – treating it as an external dependency
No name was provided for external module 'react-msaview' in output.globals – guessing 'MSA'

[cmdcolin]

The react-msaview has

dist/package.json

has

"main":"dist/index.js"

contents of dist/index.js

import MSAView from './components/MSAView';
import MSAModel from './model';
export { MSAModel, MSAView };

@garrettjstevens do you think that the rollup config can handle these es6 node module exports

[garrettjstevens]

@cmdcolin It looks like there is a "module" field in the package.json that points to a file that doesn't exist in "dist". Rollup uses "module" preferentially over "main" if it exists, so removing the "module" should cause it to resolve "main" properly.

[cmdcolin]

thanks so much for catching this @garrettjstevens

ran into a couple stumbler blocks but should be rolling now

[cmdcolin]

xref https://github.com/GMOD/jbrowse-plugin-template/issues/20 https://github.com/GMOD/jbrowse-plugin-template/issues/21