Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @ionic/vue with all npm packages installed. Try it out:

require("vue/package.json"); // vue is a peer dependency. require("vue-router/package.json"); // vue-router is a peer dependency. var vue = require("@ionic/vue")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@ionic/vue v0.0.9

Vue specific wrappers for @ionic/core

@ionic/vue (beta)

Ionic Vue.js specific building blocks on top of @ionic/core components.

To get started simply install @ionic/vue and @ionic/core with npm into your project and then register @ionic/vue as a plugin to your vue application.

import Vue from 'vue';
import Ionic from '@ionic/vue';


new Vue({
  render: h => h(App)

Publishing a Native Application

You can now make use of all of the ionic components in your vue application. If you want to publish your app to the App Store or Google Play you will need to use the ionic cli to execute Capacitor commands to do so.

More information on this can be found here. If you want to learn more about Capacitor our dedicated site can be found here.

The commands that you will need to execute are below.

ionic capacitor add
ionic capacitor copy
ionic capacitor run

Current known limitations

This is an beta release of @ionic/vue so please understand that there are some missing pieces but know that many of the components will work.

  • The shorthand v-model binding is currently not supported
  • Stack navigation for deep transitions is under heavy development at this time.




RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free