This project is currently in beta.

vue+meteor is a set of packages to help you create awesome apps quickly and efficiently with two great web technologies:

• vuejs is the frontend
• meteor is the platform (client, server, database, network)

You will be able to use meteor data inside Vue or write .vue files in your meteor project.

Examples Links

For more detailed documentations, see the usage section below.

• Simple example project
• Simple example project (Vue 2.x)
• Blaze example project [2]
• Routing example project
• Routing example project (vue 2.x)
• i18n example project
• Vuex example project

Recommended Packages Links

• 📦 vue-meteor-tracker (meteor tracker integration)
• 📦 akryum:vue-component (vue component files)
• 📦 akryum:vue-router2 (vue-router 2.x helpers)
• 📦 vue-apollo (apollo integration)
• 📦 akryum:vue-blaze-template (use blaze inside vue components)
• 📦 vue-supply (use reactive data & automatic subscriptions in components and vuex store)

Usage

Recommended: New project with Vue 2.x and without Blaze

Create a new project without blaze, using Vue 2.x:

See the simple example project.

New project with Vue 1.x and without blaze

Create a new project without blaze, using Vue 1.x:

See the simple example project.

New project with blaze

See the blaze example project.

Meteor & Tracker data integration

Declarative subscriptions and meteor reactive data

📦 See Usage in npm vue-meteor-tracker package

Single-file component

It allows you to write your components in this format with hot-reloading support.

📦 See Usage in arkyum:vue-component package

Routing

Routing for Vue 1.x and Meteor using vue-router.

📦 See Installation & Usage in arkyum:vue-router package

Example app

Routing for Vue 2.x and Meteor using vue-router.

📦 See Installation & Usage in arkyum:vue-router2 package

Example app

Apollo integration

Use apollo in your vue component!

📦 See Installation & Usage in the vue-apollo npm package

Localization

Translate your app quickly and easily with vue-i18n.

📦 See Installation & Usage in akryum:vue-i18n package

📦 Premade selection ui in akryum:vue-i18n-ui package

Example app

State management with vuex

Manage the state of your app with a centralized data store with vuex.

📦 See Installation & Usage in akryum:vuex

Example app

Embed Blaze template

Use Blaze templates inside your vue components.

📦 See Installation & Usage in akryum:vue-blaze-template

Example app

---

Features & Roadmap

Currently supported and possible future features (in no particular order) are:

• Declarative subscriptions and meteor reactive data
• Single-file components (.vue) with basic support of <template>, <script> and <style> (with optional scoped attribute)
• Instant Hot-reloading of components
• lang attribute on <style> in .vue files
• Less official integration in .vue files
• Sass official integration in .vue files
• Stylus official integration in .vue files
• lang attribute on <template> in .vue files
• Jade official integration in .vue file
• lang attribute on <script> in .vue files
• Coffeescript official integration in .vue files
• Apollo client integration
• Easy routing with vue-router out-of-the-box integration & fast-render
• Easy localization with vue-i18n out-of-the-box integration, auto-detection, server-side injection and key-in-hand ui
• Easy state management with vuex integration
• Use Blaze templates in your vue app
• module attribute on <style> in .vue files
• Typescript support in .vue files
• Server-side rendering (Vue 2.x)
• src attribute support in .vue files

Track the project progress here.

Get involved

This project is very much a work-in-progress, so your help will be greatly appreciated!
Feel free to contribute by opening a PR or an issue (but check before if the topic already exists).

Development project

Clone this repository and type in the project directory:

meteor npm install
meteor

---

LICENCE ISC - Created by Guillaume CHAU (@Akryum)