0

私のプロジェクトでは、2 つの tailwind ファイルを生成したいと考えています。

  1. フロントエンド ファイル、プレフィックスなし
  2. 管理ファイル、すべてのクラスにプレフィックスが付きます

2 つの構成ファイルを追加しました。

  • tailwind.config.js
  • tailwind.admin.config.js

内部tailwind.admin.config.jsにプロパティを追加しました:

prefix: 'tw-',

問題は webpack にあります。ルール内で代替構成を指定できません。私が何をしても、常にtailwind.config.jsファイルを使用します。

amdin ファイルの webpack ルールは次のとおりです。


{
    test: /\.css$/,
    use: [
        {
            loader: MiniCssExtractPlugin.loader,
        },
        {
            loader: 'css-loader',
            options: {
                importLoaders: 1,
            }
        },
        {
            loader: 'postcss-loader',
            options: {
                postcssOptions: {
                    plugins: [
                        require('precss'),
                        require('tailwindcss')('./tailwind.admin.config.js'),
                        require('autoprefixer'),
                    ]
                }

            },
        }
    ],
},

形式require('tailwindcss')('./tailwind.admin.config.js'),は、構成ファイルを指定するために私が見た唯一のものですが、内部では機能していませんpostcss-loader。代わりに常にデフォルトのファイルを使用します。

webpack 内で使用する正確な tailwind 構成を指定するにはどうすればよいですか?

4

1 に答える 1