Tailwind CSS样式在本地应用,但在部署时不应用

o7jaxewo  于 2023-02-26  发布在  其他
关注(0)|答案(1)|浏览(231)

我建立了一个静态的登陆页面,当使用live server启动时,它在我的笔记本电脑上按预期工作。我尝试使用www.example.com部署它,但没有一个Tailwind样式被应用。此外,图像根本没有加载。过去5个小时,我一直在用头撞墙。render.com but none of the Tailwind styles are applied. Also, the images are not loaded at all. I've been banging my head against the wall for the past 5 hours, reading different posts on the possible solution but nothing seems to work. I'm probably making a silly mistake somewhere but I can't find it. Thanks in advance!
This is the link to the github repo

    • 顺风配置js**
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./build/*.html'],
  theme: {

    extend: {
      screens: {
        '2xl':'2130px',
        'lg':'1130px',
      },
      colors: {
        'header-hero': '#fbf8f3',
        'blue-section': '#d7f5f5',
        'yellow-section': '#fbf8f3',
        'p-color': '#737373',
        'logo-color': '#3180f5'
      },
      fontFamily: {
      'inter': ["Inter", "sans-serif"],
      },
      backgroundImage: {
        'hero-mobile': "url('/assets/hero-image-desktop.png')",
        'hero-tablet': "url('/assets/hero-image-tablet.png')"
      },
    },
  },
  plugins: [],
}
    • 包. json:**
{
  "name": "chirp-starter-files",
  "version": "1.0.0",
  "description": "Codewell's aim is to provide you with real-world design templates that you can use to practice your HTML and CSS projects.",
  "main": "tailwind.config.js",
  "scripts": {
    "tailwind": "npx tailwindcss -i ./src/input.css -o ./build/css/style.css --watch",
    "prettier": "npx prettier --write **/*.html"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "prettier-plugin-tailwindcss": "^0.2.3"
  }
}

这是我如何排序我的文件:
我试过改变Tailwind配置文件中index.html文件的路径(内容),但似乎没有任何效果。我总是得到相同的结果。

bqujaahr

bqujaahr1#

我设法通过改变图像和CSS文件的路径来解决这个问题。我把所有的图像移到“build”文件夹,并把路径从/build/images/改为./images/。另外,我把CSS文件的路径从/build/css/style. css改为css/style.css。所以基本上这只是一个路径问题。谢谢你们给我指出正确的方向!

相关问题