Docs typo fixes (#4247)

+ Add lazy loading to the map examples page
REF: https://squidfunk.github.io/mkdocs-material/reference/images/?h=loading#image-lazy-loading

(Not tested this locally, Docker not working).

build/generate-docs.ts

@@ -51,7 +51,7 @@ function generateMarkdownIndexFileOfAllExamples(indexArray: HtmlDoc[]): string {
         indexMarkdown += `
 ## [${indexArrayItem.title}](./${indexArrayItem.mdFileName})
 
-![${indexArrayItem.description}](../assets/examples/${indexArrayItem.mdFileName!.replace('.md', '.png')})
+![${indexArrayItem.description}](../assets/examples/${indexArrayItem.mdFileName!.replace('.md', '.png')}){ loading=lazy }
 
 ${indexArrayItem.description}
 `;
@@ -85,12 +85,12 @@ function generateExamplesFolder() {
     fs.mkdirSync(examplesDocsFolder);
     const examplesFolder = path.join('test', 'examples');
     const files = fs.readdirSync(examplesFolder).filter(f => f.endsWith('html'));
-    const maplibreUnpgk = `https://unpkg.com/maplibre-gl@${packageJson.version}/`;
+    const maplibreUnpkg = `https://unpkg.com/maplibre-gl@${packageJson.version}/`;
     const indexArray = [] as HtmlDoc[];
     for (const file of files) {
         const htmlFile = path.join(examplesFolder, file);
         let htmlContent = fs.readFileSync(htmlFile, 'utf-8');
-        htmlContent = htmlContent.replace(/\.\.\/\.\.\//g, maplibreUnpgk);
+        htmlContent = htmlContent.replace(/\.\.\/\.\.\//g, maplibreUnpkg);
         htmlContent = htmlContent.replace(/-dev.js/g, '.js');
         const htmlContentLines = htmlContent.split('\n');
         const title = htmlContentLines.find(l => l.includes('<title'))?.replace('<title>', '').replace('</title>', '').trim()!;

docs/README.md

@@ -25,7 +25,7 @@ Finally, run:
 npm run start-docs
 ```
 
-Navigate to [http://0.0.0.0:8000/](http://0.0.0.0:8000/) to view the docs. After making changes, run `npm run generate-docs` again to apply them. Some tile service providers of the docs example pages such as MapTiler or Staida Maps might only send you tiles if the host is localhost. In that case, try http://localhost:8000.
+Navigate to [http://0.0.0.0:8000/](http://0.0.0.0:8000/) to view the docs. After making changes, run `npm run generate-docs` again to apply them. Some tile service providers of the docs example pages such as MapTiler or Stadia Maps might only send you tiles if the host is localhost. In that case, try http://localhost:8000.
 
 The examples section of the locally run documentation will use the GL JS version released that has the same version as the in the package.json.