Merge branch 'master' into issue/184

README.md

@@ -30,6 +30,17 @@ Note that the *dicom-microscopy-viewer* package is **not** a viewer application,
 Below is an example for the most basic usage: a web page that displays a collection of DICOM VL Whole Slide Microscopy Image instances of a digital slide.
 For more advanced usage, take a look at the [Slim](https://github.com/imagingdatacommons/slim) viewer.
 
+## Packaging
+
+The library is packaged as two different builds, one using dynamic import, and the other bundling into one 
+larger library.  The dynamic import version uses a public path of `/dicom-microscopy-viewer/` so that they can be used by simply adding an alias to the appropriate version, and then deploying that version.  In a straight web application, this can be loaded as:
+
+```javascript
+   const DICOMMicroscopyViewer = (await('/dicom-microscopy-viewer/dicomMicroscopyViewer.min.js')).default
+```
+
+The point of using the sub-directory here is to isolate the dependencies that unique to `dicom-microscopy-viewer`.
+
 ### Basic usage
 
 The viewer can be embedded in any website, one only needs to

config/webpack/webpack-dynamic-import.js

@@ -3,7 +3,7 @@ const merge = require('./merge')
 const rootPath = process.cwd()
 const baseConfig = require('./webpack-base')
 const TerserPlugin = require('terser-webpack-plugin')
-const outputPath = path.join(rootPath, 'dist', 'dynamic-import')
+const outputPath = path.join(rootPath, 'dist', 'dynamic-import', 'dicom-microscopy-viewer')
 
 const prodConfig = {
   mode: 'production',
@@ -12,11 +12,15 @@ const prodConfig = {
   },
   output: {
     path: outputPath,
-    libraryTarget: 'umd',
-    globalObject: 'this',
-    filename: '[name].min.js'
+    library: {
+      name: 'dicomMicroscopyViewer',
+      type: 'window',
+    },
+    filename: '[name].min.js',
+    publicPath: '/dicom-microscopy-viewer/',
   },
   optimization: {
+    // minimize: false,
     minimizer: [
       new TerserPlugin({
         parallel: true

package.json

@@ -55,7 +55,6 @@
     "@babel/plugin-transform-runtime": "^7.15.0",
     "@babel/preset-env": "^7.16",
     "@babel/runtime-corejs3": "^7.15.4",
-    "@webpack-cli/serve": "^1.5.2",
     "babel-eslint": "10.1.0",
     "babel-jest": "27.5",
     "babel-loader": "^8.2.3",
@@ -72,7 +71,7 @@
     "terser-webpack-plugin": "^5.2.2",
     "webpack": "^5.68",
     "webpack-bundle-analyzer": "^4.4.2",
-    "webpack-cli": "^4.9",
+    "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.9.0",
     "worker-loader": "^3.0.8"
   },