gpt4 book ai didi

webpacker - 无法将 Tailwindcss 安装到 Rails 6

转载 作者:行者123 更新时间:2023-12-04 17:36:31 24 4
gpt4 key购买 nike

我目前正在尝试通过 Webpack 将 Tailwind 安装到 Rails 6 应用程序中,但是按照文档操作后,样式并未应用于 View 模板,如图所示。我有 Tailwind v1.0.3。我还尝试将 Webpack 升级到 v4,所以不确定是不是因为这个。

enter image description here

我有以下文件:

javascript/css/application.css

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

我的 packs/application.js 如下所示:

require("stylesheets/application.scss")

还有我的/postcss.config.js

module.exports = {
plugins: [
require('tailwindcss'),
require('autoprefixer'),
require('postcss-import'),
require('postcss-flexbugs-fixes'),
require('postcss-preset-env')({
autoprefixer: {
flexbox: 'no-2009'
},
stage: 3
})
]
}

我还可以从 packaje.json 文件中看到实际上安装了 Tailwind。

{
"name": "artsy_space",
"private": true,
"dependencies": {
"@rails/webpacker": "3.5",
"tailwindcss": "^1.0.3",
"vue": "^2.5.17",
"vue-loader": "14.2.2",
"vue-template-compiler": "^2.5.17"
},
"devDependencies": {
"webpack-dev-server": "2.11.2"
}
}

和 application.html.erb

        <!DOCTYPE html>
<html>
<head>
<title>ArtsySpace</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'stylesheets', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>

<body>
<p class="alert alert-error">
<%= flash[:alert] %>
</p>

<p class="alert alert-info">
<%= flash[:notice] %>
</p>
<%= yield %>
</body>
</html>

H

这是一个link to a PR在 repo 中。

知道它可能是什么吗?

最佳答案

看来您可能需要错误的目录。尝试更改:

require("stylesheets/application.scss")

到:

require("css/application.css")

另外,请注意您需要一个 .scss 文件,但看起来实际文件是 .css?

关于webpacker - 无法将 Tailwindcss 安装到 Rails 6,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56509786/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com