mermaid: Webpack require fails
Requiring the package with Webpack fails in my web-project:
WARNING in ./~/mermaid/src/d3.js
Critical dependencies:
5:4-11 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/mermaid/src/d3.js 5:4-11
WARNING in ./~/mermaid/src/diagrams/flowchart/dagre-d3.js
Critical dependencies:
7:4-11 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/mermaid/src/diagrams/flowchart/dagre-d3.js 7:4-11
WARNING in ./~/mermaid/src/diagrams/flowchart/parser/dot.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/flowchart/parser/dot.jison Line 4: Unexpected token %
You may need an appropriate loader to handle this file type.
|
| /* lexical grammar */
| %lex
|
| %%
@ ./~/mermaid/src/diagrams/flowchart ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/flowchart/parser/flow.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/flowchart/parser/flow.jison Line 8: Unexpected token %
You may need an appropriate loader to handle this file type.
|
| /* lexical grammar */
| %lex
| %x string
|
@ ./~/mermaid/src/diagrams/flowchart ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/classDiagram/parser/classDiagram.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/classDiagram/parser/classDiagram.jison Line 8: Unexpected token %
You may need an appropriate loader to handle this file type.
|
| /* lexical grammar */
| %lex
| %x string struct
|
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/gantt/gant.css
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/gantt/gant.css Line 2: Unexpected token *
You may need an appropriate loader to handle this file type.
|
| * {
| margin: 0;
| padding: 0;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/example/parser/example.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/example/parser/example.jison Line 6: Unexpected token %
You may need an appropriate loader to handle this file type.
| * MIT license.
| */
| %lex
|
| %options case-insensitive
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/gantt/parser/gantt.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/gantt/parser/gantt.jison Line 6: Unexpected token %
You may need an appropriate loader to handle this file type.
| * MIT license.
| */
| %lex
|
| %options case-insensitive
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/sequenceDiagram/parser/sequenceDiagram.jison Line 11: Unexpected token %
You may need an appropriate loader to handle this file type.
| * Simplified BSD license.
| */
| %lex
|
| %options case-insensitive
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/default/flow.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/default/flow.less Line 1: Unexpected token .
You may need an appropriate loader to handle this file type.
| .mermaid .label { color:#333}
|
| .node rect,
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/default/mermaid.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/default/mermaid.less Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.
| @import "variables";
| @import "flow";
| @import "sequenceDiagram";
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/default/gantt.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/default/gantt.less Line 2: Unexpected token .
You may need an appropriate loader to handle this file type.
| /** Section styling */
| .section {
| stroke:none;
| opacity:0.2;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/default/variables.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/default/variables.less Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.
| @mainBkg: #ECECFF;
| @secondBkg: #ffffde;
| @lineColor: #333333;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/default/sequenceDiagram.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/default/sequenceDiagram.less Line 3: Unexpected token .
You may need an appropriate loader to handle this file type.
|
|
| .actor {
| stroke: @actorBorder;
| fill: @actorBkg;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/classDiagram.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/classDiagram.less Line 1: Unexpected identifier
You may need an appropriate loader to handle this file type.
| g.classGroup text {
| fill:@nodeBorder;
| stroke:none;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/gantt.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/gantt.less Line 2: Unexpected token .
You may need an appropriate loader to handle this file type.
| /** Section styling */
| .section {
| stroke:none;
| opacity:0.2;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/mermaid.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/mermaid.less Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.
| @import "variables";
| @import "flow";
| @import "sequenceDiagram";
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/flow.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/flow.less Line 1: Unexpected token .
You may need an appropriate loader to handle this file type.
| .mermaid .label {
| font-family: 'trebuchet ms', verdana, arial;
| color:#333
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/variables.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/variables.less Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.
| @mainBkg: #cde498;
| @secondBkg: #cdffb2;
| @lineColor: #1a3318;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/mermaid/src/less/forest/sequenceDiagram.less
Module parse failed: /Ruse/Nodrium/n-landing/node_modules/mermaid/src/less/forest/sequenceDiagram.less Line 3: Unexpected token .
You may need an appropriate loader to handle this file type.
|
|
| .actor {
| stroke: @actorBorder;
| fill: @actorBkg;
@ ./~/mermaid/src ^\.\/.*$
WARNING in ./~/dagre-d3/lib/graphlib.js
Critical dependencies:
5:4-11 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/dagre-d3/lib/graphlib.js 5:4-11
WARNING in ./~/dagre-d3/lib/dagre.js
Critical dependencies:
5:4-11 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/dagre-d3/lib/dagre.js 5:4-11
WARNING in ./~/dagre-d3/lib/lodash.js
Critical dependencies:
5:4-11 require function is used in a way in which dependencies cannot be statically extracted
@ ./~/dagre-d3/lib/lodash.js 5:4-11
ERROR in ./~/mermaid/src/diagrams/sequenceDiagram/sequenceDiagram.spec.js
Module not found: Error: Cannot resolve module 'proxyquire' in /Ruse/Nodrium/n-landing/node_modules/mermaid/src/diagrams/sequenceDiagram
@ ./~/mermaid/src/diagrams/sequenceDiagram/sequenceDiagram.spec.js 1:17-38
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Reactions: 1
- Comments: 15
so apparently this is fixed in webpack 2.0, but now i get a different error:
I’m also having a similar problem using webpack
Problem resolved and this is an official fix: https://github.com/knsv/mermaid/issues/361#issuecomment-306017512
In short: latest version of mermaid has no problem with webpack.