webpack tailwindcss raw-loader 后样式无法被打包?-灵析社区

复古直男

公告公告 这个代码是`index.html` 的代码,其中引入了`header.html` 文件,这个`header.html` 里面也是包含`tailwindcss` 的类名,但是使用`webpack` 打包的时候,是不会被打包进去的,这里应该是被当做 字符串处理了。 webpack config配置 const path = require("path"); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const HtmlWebpackPlugin = require("html-webpack-plugin"); module.exports = { entry: { index: "./src/ts/index.ts", }, output: { path: path.resolve(__dirname, "dist"), filename: "./js/[name].js", assetModuleFilename: "./imgs/[name][ext][query]", }, plugins: [ new MiniCssExtractPlugin({ filename: "./css/style.css", }), new HtmlWebpackPlugin({ filename: "index.html", template: "./src/index.html", chunks: ["index"], }), ], module: { rules: [ { test: /\.scss$/, use: [ { loader: MiniCssExtractPlugin.loader, options: { publicPath: "../", }, }, { loader: "css-loader", options: { importLoaders: 1 }, }, "sass-loader", "postcss-loader", ], }, { test: /\.(png|svg|jpg|gif|webp)$/, type: "asset/resource", }, { test: /\.tsx?$/, use: "ts-loader", exclude: /node_modules/, }, ], }, resolve: { extensions: [".tsx", ".ts", ".js"], }, mode: "production", devServer: { client: { overlay: false, logging: "none", }, open: true, hot: true, port: 9000, }, }; 请问: webpack 如何将`raw-loader` 引入的文件里面的tailwindscss 也一起打包到新的css文件中!

阅读量:146

点赞量:14

问AI
如果要解析,非入口文件的html css 或者其他文件。可以在 "tailwind.config.js" 中配置 module.exports = { purge: ['src/*.html','src/base/*.html'], darkMode: false, // or 'media' or 'class' theme: { extend: {}, }, variants: { extend: {}, }, plugins: [], }; 这个叫 "purge" 的配置项就可以配置其他的文件