Laravel Mix：如何将 PostCss 任务与单独的 sass 任务连接起来？

Question

我的第一个任务需要我的 SCSS 条目文件。

// Compile SCSS
mix.sass('src/scss/main.scss', 'dist/css/sass-compiled.css');

我的第二个将我的 PostCss 文件用于 TailwindCSS。

// Compile PostCSS
mix.postCss("src/css/site.pcss", "dist/css/tailwind.css", [
  require('tailwindcss/nesting'),
  require('tailwindcss')
])

我想将输出连接到单个 frontend-styles.css 文件中。

我尝试通过 mix.sass() 和 .options({ PostCSS }) 运行这两个文件，但无法使其工作。

Answer 1

第一部分你是对的。接下来，创建一个组合输出文件的新任务。您可以使用

mix.combine()

方法将多个文件合并为一个：

mix.combine([
  'dist/css/sass-compiled.css',
  'dist/css/tailwind.css'
], 'dist/css/frontend-styles.css');

然后运行：

npm run dev