<p>J'utilise Vue version 3.2.10 <strong>, je n'utilise pas Vite</strong> et j'essaie d'installer Tailwind CSS version 2.2.14 (dernière version). </p>
<p><strong>Important : Vue prend en charge PostCSS 8 à partir de la version 3.0.6</strong> (voir le point 3 mis à jour dans la documentation GitHub, sous "fonctionnalités"). </p>
<p>Après avoir suivi attentivement les instructions d'installation, j'obtiens toujours l'erreur suivante lors de l'exécution de <code>npm run serve</code> : </p>
<pre class="brush:php;toolbar:false;">erreur dans ./src/assets/main.css
Erreur de syntaxe : Erreur : le plugin PostCSS tailwindcss nécessite PostCSS 8.
Guide de migration pour les utilisateurs finaux :
https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users</pre>
<p>Voici mon fichier package.json : </p>
<pre class="brush:php;toolbar:false;">"scripts": {
"serve": "vue-cli-service servir",
"build": "build vue-cli-service"
},
"dépendances": {
"@fortawesome/fontawesome-svg-core": "^1.2.36",
"@fortawesome/free-brands-svg-icons": "^5.15.4",
"@fortawesome/free-regular-svg-icons": "^5.15.4",
"@fortawesome/free-solid-svg-icons": "^5.15.4",
"@fortawesome/vue-fontawesome": "^3.0.0-4",
"@headlessui/vue": "^1.4.1",
"core-js": "^3.6.5",
"date-fns": "^2.23.0",
"firebase": "^8.9.0",
"vue": "^3.0.0",
"vue-routeur": "^4.0.0-0"
},
"dépendances dev": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.0.0",
"autoprefixer": "^10.3.4",
"postcss": "^8.3.6",
"postcss-cli": "^8.3.1",
"tailwindcss": "^2.2.14"
}</pré>
<p>Comme mentionné ci-dessus, Vue 3.0.6 et versions ultérieures prennent définitivement en charge PostCSS 8. De plus, la description « <em>PostCSS 7 compatible build</em> » pour Tailwind CSS ne fonctionne pas.</p>
按照这些说明后,我收到以下错误:</p>
<pre class="brush:php;toolbar:false;">npm ERR ! code ERESOLVE
npm ERR ! ERESOLVE incapable de résoudre l'arborescence des dépendances
npm ERR !
npm ERR ! Trouvé : postcss@7.0.36
npm ERR ! node_modules/postcss
npm ERR ! dev postcss@"^7" du projet racine
npm ERR ! postcss@"^7.0.32" de autoprefixer@9.8.6
npm ERR ! node_modules/autoprefixer
npm ERR ! dev autoprefixer@"^9" du projet racine
npm ERR ! préfixe automatique@"^9.8.6" de @vue/cli-service@4.5.13
npm ERR ! node_modules/@vue/cli-service
npm ERR ! homologue @vue/cli-service@"^3.0.0 || ^4.0.0-0" de @vue/cli-plugin-babel@4.5.13
npm ERR ! node_modules/@vue/cli-plugin-babel
npm ERR ! dev @vue/cli-plugin-babel@"~4.5.0" à partir du projet racine
npm ERR ! 3 de plus (@vue/cli-plugin-router, @vue/cli-plugin-vuex, le projet racine)
npm ERR ! 1 de plus (vent arrière)
npm ERR ! 42 de plus (@intervolga/optimize-cssnano-plugin, ...)
npm ERR !
npm ERR ! Impossible de résoudre la dépendance :
npm ERR ! homologue postcss@"^8.0.0" de postcss-cli@8.3.1
npm ERR ! node_modules/postcss-cli
npm ERR ! dev postcss-cli@"^8.3.1" depuis le projet racine
npm ERR !
npm ERR ! Résolvez le conflit de dépendances en amont ou réessayez
npm ERR ! cette commande avec --force ou --legacy-peer-deps
npm ERR ! pour accepter une résolution de dépendance incorrecte (et potentiellement cassée).
npm ERR !
npm ERR ! Voir /Users/mgav/.npm/eresolve-report.txt pour un rapport complet.
npm ERR ! Un journal complet de cette exécution peut être trouvé dans :
npm ERR ! /Users/mgav/.npm/_logs/2021-09-08T21_09_08_052Z-debug.log</pre>
<p>感谢您的帮助!</p>
Dans certains cas, le problème ne semble pas être directement lié à VueJS, mais à vue-cli.
La solution qui a fonctionné pour moi était :
npm uninstall tailwindcss @tailwindcss/postcss7-compat
selon les instructions de la publication.npm install tailwindcss@latest postcss@latest autoprefixer@latest
.C'est tout !
Remarque : Ce n'est pas mon travail. J'ai été dirigé vers ce message sur le forum Vuejs par Lindsay Wardell (@lindsaykwardell), où la solution a été fournie par Thomas Castelly (qui n'a pas non plus de compte StackOverflow).