I'm trying to create a component with drag-drop with this library, but Angular doesn't recognize a library. ts-lint shows me the following code.
Could not find a declaration file for module 'ol-hashed'. 'C:/Users/ivangm/Desktop/openlayers-workshop/node_modules/ol-hashed/index.js' implicitly has an 'any' type.
Try `npm i --save-dev @types/ol-hashed` if it exists or add a new declaration (.d.ts) file containing `declare module 'ol-hashed';`
However, if I test the code in a pure nodejs application, I don't get this problem
My component is:
import 'ol/ol.css';
import { Component, OnInit } from '@angular/core';
import sync from 'ol-hashed';
import GeoJSON from 'ol/format/GeoJSON';
import DragAndDrop from 'ol/interaction/DragAndDrop';
import VectorLayer from 'ol/layer/Vector';
import Map from 'ol/Map';
import VectorSource from 'ol/source/Vector';
import View from 'ol/View';
@Component({
selector: 'app-drag-drop',
templateUrl: './drag-drop.component.html',
styleUrls: ['./drag-drop.component.scss']
})
export class DragDropComponent implements OnInit {
map = new Map({});
constructor() { }
ngOnInit(): void {
this.map = new Map({
target: 'map-container2',
view: new View({
center: [0, 0],
zoom: 2
})
});
sync(this.map);
const source = new VectorSource();
const layer = new VectorLayer({ source });
this.map.addLayer(layer);
this.map.addInteraction(new DragAndDrop({
source,
formatConstructors: [GeoJSON as any]
}));
}
}
And my package-json is:
{
"dependencies": {
...
"ol": "^6.5.0",
"ol-hashed": "^2.0.0",
},
"devDependencies": {
...
"@types/ol": "^6.4.2",
"parcel-bundler": "^1.12.5",
}
}
I found the solution, I leave it here commented in case someone serves you in the future.
sync()
isn't required to work with this library in Angular. So I remove this line and the import and map works.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.