通过npm加载morris.js图表

Question

我已通过package.json为 "dependencies": { "jquery": "3.2.1", "morris-js-module": "^1.2.1", "raphael": "^2.2.7" } 中的morris.js安装了要求：

// import $ from 'jquery';
// import raphael from 'raphael';
// import morris from 'morris-js-module'

class ComputerHardwareTemplate {
  constructor() {
    // alert("Lolonator")
    console.log("it is loaded correctly")
    new Morris.Line({
      // ID of the element in which to draw the chart.
      element: 'myfirstchart',
      // Chart data records -- each entry in this array corresponds to a point on
      // the chart.
      data: [{
          year: '2008',
          value: 20
        },
        {
          year: '2009',
          value: 10
        },
        {
          year: '2010',
          value: 5
        },
        {
          year: '2011',
          value: 5
        },
        {
          year: '2012',
          value: 20
        }
      ],
      // The name of the data record attribute that contains x-values.
      xkey: 'year',
      // A list of names of data record attributes that contain y-values.
      ykeys: ['value'],
      // Labels for the ykeys -- will be displayed when you hover over the
      // chart.
      labels: ['Value']
    });
    
  } // end constructor
}

export default ComputerHardwareTemplate;

var compHardware = new ComputerHardware()

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>

import morris from 'morris-js-module'

如上所示，我{j}文件中的Uncaught ReferenceError: Morris is not defined 库。

但是我收到以下错误：

{{1}}

有什么建议我做错了吗？

感谢您的回复！