Maison > interface Web > js tutoriel > Optimisation du chargement du premier écran une fois l'empaquetage du projet vuejs terminé

Optimisation du chargement du premier écran une fois l'empaquetage du projet vuejs terminé

php中世界最好的语言
Libérer: 2018-04-20 14:57:55
original
1327 Les gens l'ont consulté

Cette fois, je vais vous présenter l'optimisation du premier chargement d'écran après l'empaquetage du projet vuejs. Quelles sont les précautions pour optimiser le premier chargement d'écran après l'empaquetage du projet vuejs. Ce qui suit est un exemple pratique. cas, jetons un coup d'oeil.

1 : Utilisation des ressources CDN

Lorsque nous emballons, nous emballons.json, dependencies Le plug -ins sont empaquetés dans l'objet Nous pouvons en charger certains en utilisant cdn. Par exemple, si nous ne voulons pas intégrer vue, axios, vuex et vue-router dans notre projet, nous en avons besoin. pour ce faire :

1 : Ouvrez webpack.base.conf.js

module.exports = {
   externals: {
    ‘vue‘: ‘Vue‘,
    ‘axios‘: ‘axios‘,
    ‘vuex‘: ‘Vuex‘,
    ‘vue-router‘: ‘VueRouter‘
 }
}
Copier après la connexion

2 : Ouvrez router/index.js. Déconnectez-vous des deux lignes suivantes

//import Vue from ‘vue‘
//Vue.use(Router)
Copier après la connexion

3 : Si vous utilisez vuex, déconnectez-vous de Vue.use (Vuex) dans vuex/index.js (nommé différemment)

Vue.use(Vuex)

Problèmes possibles après emballage

1 : Les éléments entourés de keep-alive ne peuvent pas être affichés

Raison : Inconnue pour l'instant.

Solution : Pas besoin de rester en vie

Lecture recommandée : Le projet Vue utilise CDN pour optimiser le problème de chargement du premier écran

Résumé

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

vue réduit le nombre de requêtes du serveur

Comment vue utilise la mise en cache

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal