AdonisJS + Vue.js = 🔥
- Vue.js 2.0 with server-side rendering (+ cacheable components)
- Hot reloading (via webpack)
- Configurable via config/vue.js
- vuex and vue-router are installed and ready to use (synced with vue-router-sync)
- All the awesome features of AdonisJS
This is a project template for vue-cli.
vue init atinux/vue-adonis <project-name>
cd <project-name> # move to your project
mv .env.example .env # Add environment variables for Adonis
npm install # or yarn install
npm run dev
Go to http://localhost:8080
Set the env variables in your provider and add ENV_SILENT=true
so Adonis will not try to load the .env file (see docs).
npm start
Add NPM_CONFIG_PRODUCTION=false
in your env variables so it will install the dev dependencies to build the sources (see Heroku docs).
You can use external libraries like bootstrap, please see Issue #1
To understand the preFetch
method in the matched route components (resources/src/server-entry.js
), I recommend to look at https://github.com/vuejs/vue-hackernews-2.0
I recommend to use axios for making HTTP request for both client-side and server-side.
Thanks to Evan You, Aman Virk and their awesome communities for creating and maintaining Vue.js and AdonisJS 👏
There is no tests in this template because it's hard to know exactly which tests you will use and even how you want to structure them in this isomorphic application.
Here some ideas:
- adonis-rally project, it has a bunch of tests made by the creator of adonis-framework
- vue webpack template might help you to see how to structure end-to-end and unit test for you web-app