0👍
This should work.
https://webpack.js.org/guides/code-splitting/#dynamic-imports
export const actions = {
async createNewBin(store, bin) {
const { default: firebase } = await import(
/* webpackChunkName: "firebase" */ 'firebase')
// You may want code that checks if firebase is already initialized.
// Unsure if initializing multiple times throws an error.
firebase.initializeApp({
// your init options
});
const collectionRef = firebase.firestore().collection('bins');
try {
const docRef = await collectionRef.add(bin);
return docRef;
} catch (e) {
return e;
}
}
}
- [Vuejs]-Algolia refinement list not selecting values properly
- [Vuejs]-Vuejs – template, store, this.$store is undefined
0👍
Also you can find more detail about this approach here
How and when (not) to use webpack for lazy loading?
In general word the solution maybe like Eric answer with async/await
const { default: firebase } = await import(/* webpackChunkName: "firebase" */ 'firebase')
Or like this with Promise
if(iWantToLoadMyModule){
import('myModule').then( myModule =>{
// do something with myModule.default
});
}
- [Vuejs]-Pass Firebase Props onclick to methods in Vue
- [Vuejs]-Unresolved variable $firebaseRefs vue js
Source:stackexchange.com