Nous construisons une application en utilisant VueJS comme interface. Mais nous fusionnons en quelque sorte 2 applications en une seule. Du côté du commerce électronique visible au public, nous disposons d'un panneau d'administration que nos employés peuvent utiliser pour ajouter des produits, des utilisateurs, etc.
Je veux connaître la meilleure façon de concevoir chaque pièce différemment. Du côté du e-commerce, nous souhaitons utiliser 1 feuille de style (scss) puis une autre feuille de style pour notre panneau d'administration. Le problème que nous avons est que lorsque tout est compilé, les deux sont ajoutés des deux côtés de l'application. Ainsi, comme notre administrateur est chargé en second, toutes nos variables de couleur sont affichées du côté public du commerce électronique de l'application.
Nous avons retiré main.scss de main.js et créé main.scss et main-admin.scss, puis nous avons importé ces fichiers dans leurs fichiers de modèle de page respectifs, ce qui, selon nous, réunira ces deux fichiers découplés. Mais cela ne fonctionne pas, avez-vous des suggestions sur la meilleure façon d'y parvenir ?
Vous pouvez importer dynamiquement une feuille de style dans une balise de script comme ceci :