执行ng serve时使用@mapbox/mapbox-gl-draw报错求助

Hey there, let's figure out how to fix this ng serve error you're hitting! First, let's recap your current setup:

Current Dependencies #

"angular": 6.0.3,
"rxjs": "^6.2.0",
"@mapbox/mapbox-gl-draw": "^1.0.4"

When running ng serve, you're seeing an error related to @mapbox/mapbox-gl-draw (based on the screenshot you shared). Here are a few targeted steps to resolve this:

• Install the required mapbox-gl dependency
  @mapbox/mapbox-gl-draw relies on mapbox-gl to function properly, and your setup might be missing it or using an incompatible version. For Angular 6 and mapbox-gl-draw v1.0.4, install a compatible version of mapbox-gl:

  npm install mapbox-gl@^0.54.0 --save
  

• Update your Angular build configuration
  You need to include mapbox's scripts and styles in your angular.json file so Angular can bundle them correctly:

  1. Under projects -> [your-project-name] -> architect -> build -> options -> scripts, add these lines:

     "node_modules/mapbox-gl/dist/mapbox-gl.js",
     "node_modules/@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.js"
     

  2. Under the same options section, add these to styles:

     "node_modules/mapbox-gl/dist/mapbox-gl.css",
     "node_modules/@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css"
     

• Add type declarations (if you hit TypeScript errors)
  If you get errors about missing types for @mapbox/mapbox-gl-draw, create or update a typings.d.ts file in your project root and add:

  declare module '@mapbox/mapbox-gl-draw';
  

• Clean and reinstall dependencies
  Sometimes cached files cause unexpected issues. Try this to start fresh:

  rm -rf node_modules package-lock.json
  npm install
  ng serve --open
  

Give these steps a go—they should resolve the error you're facing!

内容的提问来源于stack exchange，提问作者Ketan Akbari