축 Next.JS 고 tailwindcss

0

질문

내가 사용하는 TailwindCSS 및 NextJs 에 대한 내용. 모든 작업을 때 나 npm run dev 하지만 내가 npm run build 다음 npm run start 가 있는 클래스를 작동하지 않습니다. For exemple 에서 이 코드 h-20 / text-white 이 작동하지 않지만 다른 순풍 클래스를 완벽하게 작동...

<div class="flex text-white font-semibold cursor-pointer">
<div class="flex-1 h-20 center-hv text-center bg-blue-primary hover:bg-blue-hover button-shadow">
    <div>
        <div>Acheter 200 €</div>
    </div>
</div> 
</div>

내 confs:

//next.config.js

module.exports = {
    images: {
      domains: ["picsum.photos"],
    },
    env: {
      customKey: 'my-value',
    }
  }
//postcss.config.js

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}
//tailwind.css

module.exports = {
  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {
      backgroundColor: theme => ({
        ...theme('colors'),
        'blue-primary': '#A9C4D2',
        'blue-secondary': '#bbd9e8',
        'blue-hover': '#74afcd',
        'alert-info': '#d5e9f3',
        'alert-warning': '#ffd585',
        'alert-danger': '#ffb3b3'
      }),
      textColor: theme => ({
        ...theme('colors'),
        'blue-primary': '#A9C4D2',
        'blue-secondary': '#bbd9e8',
        'blue-hover': '#74afcd',
        'alert-info': '#d5e9f3',
        'alert-warning': '#ffd585',
        'alert-danger': '#ffb3b3'
      }),
    },
    flex: {
      '1': '1 1 0%',
      '2': '2 2 0%',
      '3': '3 3 0%',
      '4': '4 4 0%',
      '5': '5 5 0%',
      auto: '1 1 auto',
      initial: '0 1 auto',
      inherit: 'inherit',
      none: 'none',
    }
  },
  variants: {
    extend: {},
  },
  plugins: [],
}
//jsconfig.json

{
    "typeAcquisition": {
        "include": ["jest"]
    }
}
//_app.js

import Navigation from '../componsants/navigation/Navigation'
import '../styles/globals.css'
import 'tailwindcss/tailwind.css'

function MyApp({ Component, pageProps }) {

  return (
    <>
      <div className="mtb">
        <Navigation />
        <Component {...pageProps} />
      </div>
    </>
  )
}

export default MyApp

내가 알지 못하는 경우에 당신이 어떤 아이디어가 있습니까? 내가 다음에 tailwind 문서지만,그것은 다음과 같은 충분하지 아아

다.

javascript next.js reactjs tailwind-css
2021-11-23 22:50:03
2
0

면 일부는 클래스 작동하지 않고,다른 작업=확인 tailwind.css

또한,당신은 예 Nextjs-순풍

P.S. 코드를 테스트

2021-11-25 11:03:21
0

내가 찾은 응답에 다른 게시물 테스트 기 때문에 나는 일부 구성 요소에 있는 conditionnal 렌더링하고있는 동안 건물 내 응용 프로그램 순풍을 만들지 않는 클래스

이를 해결하기 위해 할 수 있습니다:

  • 삭제거에서 순풍 conf 파일(하지만 그것이 있어야 임시)
  • 구성 요소를 만들고 선언하는 모든 클래스 당신
2021-11-25 10:51:20

다른 언어로

이 페이지는 다른 언어로되어 있습니다

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................