Use a dynamic import instead of weakRequire

Author: lordofthelake

src/jsonUtils/makeSvgLayer/makeSvgLayer.sketch.ts

@@ -3,11 +3,11 @@ import convertSketchToJson from '../sketchJson/convertSketchToJson';
 
 import { LayoutInfo } from '../../types';
 
-export default function makeSvgLayer(
+export default async function makeSvgLayer(
   _layout: LayoutInfo,
   name: string,
   svg: string,
-): FileFormat.Group {
+): Promise<FileFormat.Group> {
   const svgString = NSString.stringWithString(svg);
   const svgData = svgString.dataUsingEncoding(NSUTF8StringEncoding);
   const svgImporter = MSSVGImporter.svgImporter();

src/jsonUtils/makeSvgLayer/makeSvgLayer.ts

@@ -6,7 +6,6 @@ import { createUniformBorder } from '../borders';
 import layerGroup from '../layerGroup';
 import { makePathsFromCommands, makeLineCapStyle } from './graphics/path';
 import { unionRects, scaleRect, makeBoundingRectFromCommands, resize } from './graphics/rect';
-import weakRequire from '../../utils/weakRequire';
 
 function makeLayerFromPathElement(pathElement, _parentFrame: FileFormat.Rect, scale: number) {
   const {
@@ -78,8 +77,13 @@ function makeLayerGroup(
   return group;
 }
 
-export default function makeSvgLayer(layout: LayoutInfo, name: string, svg: string) {
-  const svgModel = weakRequire(module, '@lona/svg-model');
+export default async function makeSvgLayer(
+  layout: LayoutInfo,
+  name: string,
+  svg: string,
+): Promise<FileFormat.Group> {
+  // Load the module only if it has been made available through another import.
+  const svgModel = await import(/* webpackMode: "weak" */ '@lona/svg-model');
 
   const {
     data: { params, children },

src/renderers/SvgRenderer.ts

@@ -80,7 +80,7 @@ export default class SvgRenderer extends ViewRenderer {
       children,
     });
 
-    const svgLayer = makeSvgLayer(layout, 'Shape', svgString);
+    const svgLayer = await makeSvgLayer(layout, 'Shape', svgString);
 
     layers.push(svgLayer);