将 Elixir Phoenix 配置为独立使用 Tailwind 后，如何启用 tailwindcss/nesting？

Question

我成功关注Chris McCord's Tailwind Standalone for Phoenix instructions添加Tailwind。

但我想启用tailwindcss/nesting 插件。 https://tailwindcss.com/docs/using-with-preprocessors 说：

它直接包含在tailwindcss包本身中，所以要使用它 您需要做的就是将它添加到您的 PostCSS 配置中，某处 在顺风之前……

但是当我像这样将两个 require 说明符添加到我的 tailwind.config.js 时：

module.exports = {
  content: [
    './js/**/*.js',
    '../lib/*_web/**/*.*ex'
  ],
  theme: {
    extend: {
    },
  },
  plugins: [
    require('tailwindcss/nesting'),
    require('tailwindcss'),
  ],
}

...我得到（当我运行mix phx.server）：

node:internal/modules/cjs/loader:933
  const err = new Error(message);
              ^

Error: Cannot find module 'tailwindcss/nesting'
Require stack:
- /Users/dspitzer/dev/from_github/ssauction_live_fly/assets/tailwind.config.js
- /snapshot/tailwindcss/lib/cli.js
- /snapshot/tailwindcss/standalone-cli/standalone.js
1) If you want to compile the package/file into executable, please pay attention to compilation warnings and specify a literal in 'require' call. 2) If you don't want to compile the package/file into executable and want to 'require' it from filesystem (likely plugin), specify an absolute path in 'require' call using process.cwd() or process.execPath.

它包含在 tailwindcss 包本身中。

我注意到当我从我的tailwind.config.js 远程请求tailwindcss/nesting 插件时：

module.exports = {
  content: [
    './js/**/*.js',
    '../lib/*_web/**/*.*ex'
  ],
  theme: {
    extend: {
    },
  },
  plugins: [
    require('tailwindcss'),
  ],
}

...我还是明白了：

node:internal/modules/cjs/loader:933
  const err = new Error(message);
              ^

Error: Cannot find module 'tailwindcss'
Require stack:
- /Users/dspitzer/dev/from_github/ssauction_live_fly/assets/tailwind.config.js
- /snapshot/tailwindcss/lib/cli.js
- /snapshot/tailwindcss/standalone-cli/standalone.js
1) If you want to compile the package/file into executable, please pay attention to compilation warnings and specify a literal in 'require' call. 2) If you don't want to compile the package/file into executable and want to 'require' it from filesystem (likely plugin), specify an absolute path in 'require' call using process.cwd() or process.execPath.

如果这有帮助：

$ which tailwindcss
/Users/dspitzer/bin/tailwindcss
$ tailwindcss --help

tailwindcss v3.0.7

Usage:
   tailwindcss [--input input.css] [--output output.css] [--watch] [options...]
   tailwindcss init [--full] [--postcss] [options...]

Commands:
   init [options]

Options:
   -i, --input              Input file
   -o, --output             Output file
   -w, --watch              Watch for changes and rebuild as needed
       --content            Content paths to use for removing unused classes
       --postcss            Load custom PostCSS configuration
   -m, --minify             Minify the output
   -c, --config             Path to a custom config file
       --no-autoprefixer    Disable autoprefixer
   -h, --help               Display usage information

（我使用的是 macOS。）

Answer 1

这些是与 github tailwind 存储库中的一些提示相关的问题：

Does Tailwind CLI support the nested classes?

Tailwind Cli doesn't support nested classes