vscode - typescript setting
$ tsc --init
ctrl + shift + b -> watch
react + typescript + leaflet
create project $ npx create-react-app@latest project-name –template typescript $ cd project-name $ yarn add react react-dom leaflet $ yarn add react-leaflet $ yarn add -D @types/leaflet add App.css .leaflet-container { width: 100%; height: 100vh; } change App.tsx import { MapContainer, TileLayer } from "react-leaflet"; import "leaflet/dist/leaflet.css"; import "./App.css"; function App() { return ( <div className="App"> <MapContainer center={[36, 128]} zoom={4} scrollWheelZoom={true}> <TileLayer attribution='© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" /> </MapContainer> </div> ); } export default App;
댓글
댓글 쓰기