Skip to content
Go to file


Failed to load latest commit information.
Latest commit message
Commit time

Wegue (WebGIS with OpenLayers and Vue.js)

Template and re-usable components for webmapping applications with OpenLayers and Vue.js

Build Status Known Vulnerabilities dependencies Status license: 2-Clause BSD Join the chat at

Go to the online demo at


Wegue (WebGIS with OpenLayers and Vue) combines the power of Vue.js and the geospatial savvy of OpenLayers to make lightweight webmapping applications. For styling and pre-defined UI-components the Material Design Component Framework Vuetify is used.

It acts as a template to reduce boilerplate work for browser-based mapping applications.

Want to contribute? Yes, please 😀

If you want to contribute, please open a Pull Request in the repository.

Ensure that you have clean commits (and messages) and a meaningful description in your PR. Maybe opening an issue first is a good idea.

We look forward to your contributions!


Prerequisites: Node.js and npm need to be available on your system.

Dev Setup

  • Checkout / download this repository and navigate to the checkout / download in a terminal (e.g. by cd /path/to/checkout).

  • Install the JS dependencies:

# install dependencies
npm install
  • Run the init-app script, which creates a base application (a copy of the app-starter dir) under app/ to extend with custom components and resources (e.g. CSS styling) for your project.
# initializes the Wegue app
npm run init:app
# serve with hot reload at localhost:8081
npm run dev

Unit tests

To run all unit tests execute the following:

# run all tests
npm test

NB the unit tests require Chrome or Chromium browser executable to be found.

On Mac OSX with Homebrew package manager this should work:

brew cask install chromium;
export CHROME_BIN=/Applications/;
npm run test

More testing tips and tricks can be found in the Unit Test README.

Production build

Run the build script in order to create a production build, which can be copied / deployed to a web server. The output will be placed in the dist/ folder

# build for production with minification
npm run build

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

Run with Docker

Versioned Docker images are available on DockerHub. Run the latest (master) version of the Wegue Docker Image as follows:

docker run -it -p 8080:80 meggsimum/wegue:latest


in a browser.

Use Docker Volume Mapping to run with your custom Wegue JSON config:

docker run -it -p 8080:80 -v $(pwd)/app-conf-mine.json:/usr/share/nginx/html/static/app-conf-mine.json meggsimum/wegue:latest

and open http://localhost:8080/?appCtx=mine.

You can even overwrite the default config app-conf.json:

docker run -it -p 8080:80 -v $(pwd)/app-conf-mine.json:/usr/share/nginx/html/static/app-conf.json meggsimum/wegue:latest

and then open http://localhost:8080/.

Build a Wegue Docker Image as follows:

docker build -t meggsimum/wegue:latest .

Who do I talk to?

You need more information or support? Please contact us at:



The basic project setup was created by

Thanks for this great template! 👍


Template and components for webmapping applications with OpenLayers and Vue.js





No packages published


You can’t perform that action at this time.