Skip to content

Latest commit

 

History

History

demo

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
.vscode
.vscode
 
 
public
public
 
 
src
src
 
 
.env
.env
 
 
.gitignore
.gitignore
 
 
README.md
README.md
 
 
folder-structure.png
folder-structure.png
 
 
github-page-deploy.png
github-page-deploy.png
 
 
index.html
index.html
 
 
package-lock.json
package-lock.json
 
 
package.json
package.json
 
 
vite.config.js
vite.config.js
 
 

README.md

Vite + Vue2 + Pinia + Esri ArcGIS API for JavaScript template

This template should help get you started developing with Vue2 with Esri ArcGIS API in Vite. The template uses Vue2 option API and Pinia for state management.

How to run

MAKE SURE YOU SET YOUR ESRI API KEY IN .env.local (create one if you do not)

in .env.local add the following line VITE_ESRI_API_KEY="YOUR_API_KEY"

you should have the following folder structure folder-structure

npm i
npm run dev

How to build

npm run build
npm run preview

How to deploy to GitHub page

  • update deploy-page.yml for the following fields
    • working-directory: ./<your-gui-project-folder>/
    • cache-dependency-path: './<your-gui-project-folder>/package-lock.json'
    • path: './<your-gui-project-folder>/dist'
  • update `vite.config.js base
    • base: "/<your-repo-name>/"
  • go to your github repo -> Setting -> Pages -> Build and Deployment -> Source -> GitHubAction

github-page-deploy