Блог

Главная - Вопросы по программированию - Tailwindcss не работает в Vue.js когда весь процесс интеграции был завершен?

Tailwindcss не работает в Vue.js когда весь процесс интеграции был завершен?

#css #sass #less #tailwind-css #scss-mixins

#css #sass #Меньше #попутный ветер-css #scss-mixins

Вопрос:

я установил tailwindcss в vuejs SPA, все настройки создали assets/css/tailwind.css и добавили необходимые базовые стили, импортировали его в main.js файл создает postcss.config.js файл и скопировал требуемую конфигурацию из официальной документации, но стили tailwind не применяются к моим разметкам.

Внутри tailwind.css:

     @tailwind base;
    
    @tailwind components;
    
    @tailwind utilities;

Внутри postcss.config.js:

     module.exports = { 
        plugins: [ 
            // ... 
            require("tailwindcss"),
            require("autoprefixer"), 
            // ... 
        ],
    }

Внутри main.js файл:

     import Vue from "vue"
    import App from "./App.vue"
    import "./registerServiceWorker"
    import router from "./router"
    import store from "./store"
    import axios from "axios"
    import "./assets/css/tailwind.css"
    import firebase from "firebase/app"
    import "firebase/firestore"
    import "firebase/auth"

Файл package.json:

     "dependencies": { 
        "autoprefixer": "^9.7.6",
        "axios": "^0.19.2",
        "core-js": "^3.6.4",
        "firebase": "^7.14.2",
        "register-service-worker": "^1.7.1",
        "tailwindcss": "^1.4.0",
        "vue": "^2.6.11",
        "vue-router": "^3.1.6",
        "vuex": "^3.1.3"
    },

Я не знаю, что я делаю не так.

Комментарии:

1. странно, у меня такая же проблема, даже после документа

2. Я нашел ответ, брат, когда ты завершишь этот процесс. Затем снова перезапустите сервер, используя «NPM RUN SERVE», потому что, когда мы добавляем файлы конфигурации в файлы src, сервер не обновляется, поэтому tailwind не работает. Итак, после того, как все сделано, перезапустите службу, я надеюсь, что все будет работать нормально.

3. Спасибо, Надим, я получил его, обновив версию узла с 10 по 15

Ответ №1:

Из документов Tailwind Vue:

После описанных вами шагов необходимо снова запустить vue.

Метки: