Last active
July 3, 2018 16:16
-
-
Save Akryum/dd99707adf9340e70924ef85ffd568fb to your computer and use it in GitHub Desktop.
vue-cli SSR
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Existing imports | |
import Vue from 'vue' | |
import router from './router' | |
import store from './store' | |
// Other existing code here | |
// Add 'app' variable | |
const app = new Vue({ | |
// Existing options | |
router, | |
store, | |
provide: apolloProvider.provide(), | |
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Existing imports | |
import Vue from 'vue' | |
// Transform router import | |
import { createRouter } from './router' | |
// Transform store import | |
import { createStore } from './store' | |
// Inject import | |
import nuxt from 'nuxt' | |
// Generate createApp func | |
export default function createApp(context) { | |
// Generate createAppContext | |
const appContext = new nuxt.createAppContext(context) | |
// Generate create statements | |
const router = createRouter(context) | |
const store = createStore(context) | |
// Other existing code here | |
// Add 'app' variable | |
const app = new Vue({ | |
// Existing options | |
router, | |
store, | |
provide: apolloProvider.provide(), | |
// Inject root option | |
...appContext.rootOptions() | |
}) | |
// Detect router, vuex, ... | |
// Used in servery entry for pre-fetching | |
appContext.use({ | |
router, | |
store, | |
apolloProvider | |
}) | |
// Generate return | |
return { | |
app, | |
appContext | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Existing imports | |
import Vue from 'vue' | |
import VueRouter from 'vue-router' | |
// Existing Vue.use | |
Vue.use(VueRouter) | |
const router = new VueRouter({ | |
// Existing options | |
}) | |
export default router |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Existing imports | |
import Vue from 'vue' | |
import VueRouter from 'vue-router' | |
// Existing Vue.use | |
Vue.use(VueRouter) | |
// Wrap in function | |
export function createRouter (context) { | |
const router = new VueRouter({ | |
// Existing options | |
}) | |
// Generate return | |
return router | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Vue from 'vue' | |
import Vuex from 'vuex' | |
Vue.use(Vuex) | |
const store = new Vuex.Store({ | |
// Existing options | |
}) | |
export default store |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Vue from 'vue' | |
import Vuex from 'vuex' | |
Vue.use(Vuex) | |
export function createStore (context) { | |
const store = new Vuex.Store({ | |
// Existing options | |
}) | |
return store | |
} |
Also we could modify every vuex module to change state
to a function.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
And we would need to change the
router
as well:import router from 'XXX'
withimport { createRouter } from 'XXX'
wrapInExportedFunction
to generate thecreateRouter
function.Same for
store
.