At VueConf Toronto, Ionic announced the first alpha release of @ionic/vue, making it possible to add Ionic 4 to any Vue.js project, getting access to Ionic's APIs in a Vue.js-friendly manner.
Ionic lets web developers build, test, and deploy cross-platform hybrid mobile apps. Before version 4, Ionic's primary focus was Angular, but with Ionic 4 the goal is to make Ionic work seamlessly with any framework to provide a flexible user interface component layer.
The Ionic team wanted to verify the success of the Vue.js and Ionic integration to ensure independence from Angular. Through a collaboration with Modus Create, the viability of Ionic and Vue.js integration was put to the test. Modus leverages Ionic Framework, Vue.js, and Capacitor to create Beep,an app using Ionic Framework, Vue, and Capacitor that allows anyone to check if their email has been part of any data breaches.
To use Ionic within a Vue.js application, install the @ionic/vue package with npm:
npm install @ionic/vue
Then, with the application's main.js, import the Ionic framework:
import Vue from 'vue';
import App from './App.vue';
import { Ionic } from '@ionic/vue';
Vue.use(Ionic);
new Vue({
render: h => h(App)
}).$mount('#app');
Ionic is an open source Framework with a collection of UI components for building cross-platform applications using HTML, CSS, and JavaScript. Ionic applications can get deployed natively to iOS and Android devices, to the desktop with Electron, or as progressive web apps.
According to Mike Hartington of Ionic, The Ionic team seeks early feedback on how to improve @ionic.vue:
We’ve always said that Ionic’s biggest asset is our large, passionate community and now we need your feedback. If you’re a big Vue fan and want to give Ionic Framework a try, let us know how it goes. You can reach out to us on the Ionic forum, slack, or GitHub.
Initial community feedback via Twitter is mostly positive. John Papa, principal developer advocate at Microsoft, asked about plans for integrating Ionic with the vue-cli add command, and received confirmation from Hartington that Ionic will "offer a vue project type from our cli, as well as a plugin to add."
With the recent NativeScript support for Vue.js and now Ionic, full-stack deveoper Rich Klein expresses interest in @ionic/vue:
Vue.js is on a hot streak. Definitely want to test this for a project when the beta is ready.
@ionic/vue is available under the MIT open source license. Contributions are welcome via the @ionic/vue GitHub package and should follow the Ionic contribution guidelines and code of conduct.