最近在学习使用jointjs是遇到导包的问题：Uncaught TypeError: Failed to resolve module specifier "@joint/core". Relative references must start with either "/", "./", or "../".
下面是两个详细的报错信息：
我的本地代码：
html：
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JointJS 示例</title>
<!-- 引用外部样式文件 -->
<link rel="stylesheet" href="demo01.css">
</head>
<body>
<!-- Paper 容器 -->
<div id="paper-container"></div>
<!-- 引用 JointJS 核心库 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jointjs/3.7.1/joint.min.js"></script>
<!-- 引用外部 JS 文件 -->
<script type="module" src="demo01.js"></script>
</body>
</html>
JS:
import { dia, shapes } from '@joint/core';
// 创建 Graph 模型
const graph = new dia.Graph();
// 创建 Paper 视图
const paper = new dia.Paper({
el: document.getElementById('paper-container'),
model: graph,
width: '100%',
height: '100%',
gridSize: 10,
drawGrid: true
});
// 创建两个矩形元素
const rect1 = new shapes.standard.Rectangle();
rect1.position(100, 30);
rect1.resize(100, 40);
rect1.attr({
body: {
fill: '#3498db'
},
label: {
text: '矩形1',
fill: '#ffffff'
}
});
const rect2 = new shapes.standard.Rectangle();
rect2.position(300, 30);
rect2.resize(100, 40);
rect2.attr({
body: {
fill: '#e74c3c'
},
label: {
text: '矩形2',
fill: '#ffffff'
}
});
// 将元素添加到 Graph 中
graph.addCells([rect1, rect2]);
// 创建一个连接两个矩形的连线
const link = new shapes.standard.Link();
link.source(rect1);
link.target(rect2);
// 将连线添加到 Graph 中
graph.addCell(link);
```
package.json:
不知道问题出在哪里，请帮忙看看，感谢！！s
