我使用 Create-React-App 创建了一个新的 React 项目。在旧项目中，每当我在组件中进行更改并保存组件时，它都会反映在浏览器中，但在新项目中，当我保存代码中的更改时，浏览器不会重新加载，也不会反映更改。所以我停止了正在运行的进程并再次给出npm start
这是我的 package.json 文件。
{
"name": "new-application",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.4.0",
"@testing-library/user-event": "^7.2.1",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
"react-scripts": "3.3.0",
"redux": "^4.0.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last …我在地图盒上看到了一些动画线的例子，但我还没有发现任何在两点之间创建线性线的例子。我可以在地图上创建标记，也可以在这些标记之间画一条线。但是，我想慢慢地创建从原点（开始）到目的地（结束）的那条线。这是在两个坐标之间画线的代码。我只想慢慢地（动画地）制作它，然后重复该动画。
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>Animate a line</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.50.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.50.0/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
#route {
stroke-dasharray: 1000;
stroke-dashoffset: 1000;
animation: dash 1s linear alternate infinite;
}
@keyframes dash {
from {
stroke-dashoffset: 1000;
}
to {
stroke-dashoffset: 0;
}
}
</style>
</head>
<body>
<div id='map'></div>
<script>
mapboxgl.accessToken =
"pk.eyJ1IjoiaHllb25namlua2ltIiwiYSI6ImNpZXh4dXp5eDA2YjFzaGtyOGR2dnBza2oifQ.a5K673tSr0cOcYoX1rpPhg";
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
center: …