Revert "fix: Setup the dynamic import so it is separate from other pa…

…ckages (#113)"

This reverts commit 2834944.

README.md

@@ -30,17 +30,6 @@ 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', 'dicom-microscopy-viewer')
+const outputPath = path.join(rootPath, 'dist', 'dynamic-import')
 
 const prodConfig = {
   mode: 'production',
@@ -12,15 +12,11 @@ const prodConfig = {
   },
   output: {
     path: outputPath,
-    library: {
-      name: 'dicomMicroscopyViewer',
-      type: 'window',
-    },
-    filename: '[name].min.js',
-    publicPath: '/dicom-microscopy-viewer/',
+    libraryTarget: 'umd',
+    globalObject: 'this',
+    filename: '[name].min.js'
   },
   optimization: {
-    // minimize: false,
     minimizer: [
       new TerserPlugin({
         parallel: true

package.json

@@ -55,6 +55,7 @@
     "@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",
@@ -71,7 +72,7 @@
     "terser-webpack-plugin": "^5.2.2",
     "webpack": "^5.68",
     "webpack-bundle-analyzer": "^4.4.2",
-    "webpack-cli": "^5.1.4",
+    "webpack-cli": "^4.9",
     "webpack-dev-server": "^4.9.0",
     "worker-loader": "^3.0.8"
   },

src/viewer.js

@@ -687,7 +687,7 @@ function _getColorPaletteStyleForPointLayer ({
   return { color: expression }
 }
 
-const _affine = Symbol.for('affine')
+const _affine = Symbol('affine')
 const _affineInverse = Symbol('affineInverse')
 const _annotationManager = Symbol('annotationManager')
 const _annotationGroups = Symbol('annotationGroups')
@@ -698,8 +698,8 @@ const _drawingLayer = Symbol('drawingLayer')
 const _drawingSource = Symbol('drawingSource')
 const _features = Symbol('features')
 const _imageLayer = Symbol('imageLayer')
-const _interactions = Symbol.for('interactions')
-const _map = Symbol.for('map')
+const _interactions = Symbol('interactions')
+const _map = Symbol('map')
 const _mappings = Symbol('mappings')
 const _metadata = Symbol('metadata')
 const _opticalPaths = Symbol('opticalPaths')