Maison > interface Web > js tutoriel > le corps du texte

Comment résoudre l'erreur CSS lors de la configuration de Mint-UI dans Vue

小云云
Libérer: 2018-01-25 10:50:20
original
2482 Les gens l'ont consulté

Après l'introduction de mint-ui dans vue2.0, une erreur CSS a toujours été signalée. Cet article présente principalement la solution au problème de la configuration de mint-ui pour signaler les erreurs CSS dans vue. Il est d'une grande valeur pratique. ceux qui en ont besoin peuvent s'y référer. Ensuite, j'espère que cela pourra aider tout le monde.

Mais css-loader style-loader a été configuré dans package.json, et css a été configuré dans webpack.config, mais cette erreur est toujours signalée. Au contraire, si vous commentez la configuration CSS dans webpack.config, il n'y aura pas d'erreur. Pourquoi ?

Parce que le répertoire dans lequel les CSS sont importés n'est pas défini dans webpack.config, car par défaut nous n'importerons les CSS que dans le répertoire /src/, mais mint-ui doit être importé dans les node_modules , alors ajoutez un élément


{
    test: /\.css$/,
    include: [
     /src/,
     '/node_modules/mint-ui/lib/'  //增加此项
    ],
    loader: "style!css"
   },
Copier après la connexion

à la configuration CSS dans webpack.config Bien sûr, babelrc doit être configuré comme ceci :

.

{
 "presets": [
    "es2015","stage-0"
    ],
 "plugins": [
  ["component", [
   { 
    "libraryName": "mint-ui",
    "style": true 
   }
  ]]
 ]
}
Copier après la connexion

Assurez-vous que tous les plug-ins qui convertissent es6 en es5 ont été installés

La configuration dans webpack. .config doit être complet :

Si presets:['es2015'] n'est pas configuré dans webpack.config, une erreur d'importation sera signalée :

Cette erreur est causée par l'échec de l'échappement de la syntaxe es6

Remarque : la configuration de webpack.config dépend de la version de webpack dont disposent les différentes versions. différentes méthodes de configuration. Me voici. La version webpack1.0 est utilisée.

Recommandations associées :

Introduction à l'utilisation du sélecteur dans vue mint-ui

vue mint-ui imitation adresse de livraison Taobao Jingdong Liaison à quatre niveaux

Analyse du composant Loadmore dans vue mint-ui

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:
css
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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!