No provider for "config"! (Resolving: bpmnRenderer -> config)

[Felipe_Sullivan]

I just see this error after my deploy by vercel. When I’m in dev or when I’m in prod (after yarn build), this work perfectly, but when I deploy this, the website just broken with this error… My code bellow

note: I’m using next 13.4.13

'use client';

import React, { useEffect, useRef } from 'react';
import BpmnViewer from 'bpmn-js/lib/Modeler';
import camundaModdle from 'camunda-bpmn-moddle/resources/camunda.json';
import 'bpmn-js/dist/assets/diagram-js.css';
import 'bpmn-font/dist/css/bpmn-embedded.css';
import 'bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css';
import { useBPMN } from '~/src/app/shared/hooks/useBPMN';

export function BpmnView({ children }) {
  const { xml, setXml } = useBPMN();
  const canvaRef = useRef(null);

  useEffect(() => {
    const options = {
      container: canvaRef.current,
      moddleExtensions: {
        camunda: camundaModdle
      }
    }

    const viewer = new BpmnViewer(options);

    const importXML = async (xml, Viewer) => {
      await Viewer.importXML(xml, (err) => {
        if (err) {
          return console.error('could not import BPMN 2.0 diagram', err);
        }
      });
    };

    viewer.on('element.changed', (e) => {
      const element = e.element;

      console.log(element);
    });

    const getXML = async () => await importXML(xml, viewer);

    getXML();
  }, [xml]);

  return (
    <div className="relative h-full border-t-[1px] border-primary" id="js-canvas" ref={canvaRef}>
      {children}
    </div>
  );
}

[IIlyichev]

Hi @Felipe_Sullivan. I faced with the same problem some time ago. The reason in the swc minification, try to switch it off (see Architecture: Next.js Compiler | Next.js). Minification breaks some things in the didi, it’s a dependency injection tool that is used by diagram-js. Looks like swc minification changes one of reserved words and as a result dependencies are handled in a wrong order.
Hope it helps

[Felipe_Sullivan]

note: sorry if I apparently rude, english is not my native language!

It really works! I can’t explain how much I’m happy for your help. I’ve try so much things!!! Thanks, bro…

If u can, just let me know: how did u discover that?

[IIlyichev]

@Felipe_Sullivan

If u can, just let me know: how did u discover that?

I’m really glad to hear that it helped you. English is not my native language too, I’m from Russia
I faced with this bug earlier but that time I applied a temporary solution - switched environment to development. Today I had to find a final fix and I debugged both modes: production and development. The exception was thrown by the didi module and I realized that dependencies list is different when I run the application on different environments. I checked didi documentation, it uses static $inject annotation, then it came to my mind that this annotation may be affected by the NextJs build process, I checked build settings and disabled minifaction and it helped.