The introduction of vue to Amap always fails in import AMap.

when vue introduces Amap, he can"t import AMap undefined all the time. Dare to ask all the bosses how to solve it!

first of all, after I introduced amap.js, in index.html, I configured it in the webpack.base.conf.js file as follows:
module.exports = {

extensions: [".AMap"]

}
finally, import AMap from "AMap",
result is introduced into the component

Javascript
Dec.08,2021

how was introduced, can you paste the code

except for
1.extensions: ['AMap']
2. To use the script tag to introduce amap's js
, but also pay attention to the asynchronous problem, here I used to find on the Internet, the source of the async/await forgot. 

window._polygon = [];//data
window._markerList = [];

import AMap from 'AMap';  


  async mounted() {
    // 
    this.c_center = [
      this.$route.query["lng"] || 121.099038,
      this.$route.query["lat"] || 31.578119
    ];

    await this.initMap();
  },
  methods: {
    initMap() {
      let AMapUI = (this.AMapUI = window.AMapUI);
      let AMap = (this.AMap = window.AMap);//window
      let mapConfig = {
        zoom: 12,
        center: [121.099038, 31.578119], //
        crs: "EPSG3857",
        zooms: [10, 20],
        layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer.RoadNet()],
        resizeEnable: true
      };

      window.map = new AMap.Map("amapContainer", mapConfig);

      this.addPlugin(map);
      this.getList(true);
    },
    addPlugin(map) {
      AMap.plugin(["AMap.ToolBar", "AMap.Scale", "AMap.MapType"], function() {
        map.addControl(new AMap.ToolBar());
        map.addControl(new AMap.Scale());
        map.addControl(new AMap.MapType());
      });
    },
  }

Previous: Problems with vscode code formatting

Next: Redux-persist 's getItem and setItem reported an error?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu