diff --git a/commands/hugobuilder.go b/commands/hugobuilder.go index 84608ca374c..1a4a6126495 100644 --- a/commands/hugobuilder.go +++ b/commands/hugobuilder.go @@ -920,7 +920,7 @@ func (c *hugoBuilder) handleEvents(watcher *watcher.Batcher, if len(otherChanges) > 0 { livereload.ForceRefresh() // Allow some time for the live reload script to get reconnected. - time.Sleep(100 * time.Millisecond) + time.Sleep(200 * time.Millisecond) } for _, ev := range cssChanges { diff --git a/common/hexec/exec.go b/common/hexec/exec.go index 49291354dd0..4f23d20f505 100644 --- a/common/hexec/exec.go +++ b/common/hexec/exec.go @@ -21,8 +21,10 @@ import ( "io" "os" "os/exec" + "path/filepath" "regexp" "strings" + "sync" "github.com/cli/safeexec" "github.com/gohugoio/hugo/config" @@ -84,7 +86,7 @@ var WithEnviron = func(env []string) func(c *commandeer) { } // New creates a new Exec using the provided security config. -func New(cfg security.Config) *Exec { +func New(cfg security.Config, workingDir string) *Exec { var baseEnviron []string for _, v := range os.Environ() { k, _ := config.SplitEnvVar(v) @@ -95,6 +97,7 @@ func New(cfg security.Config) *Exec { return &Exec{ sc: cfg, + workingDir: workingDir, baseEnviron: baseEnviron, } } @@ -119,15 +122,23 @@ func SafeCommand(name string, arg ...string) (*exec.Cmd, error) { // Exec enforces a security policy for commands run via os/exec. type Exec struct { - sc security.Config + sc security.Config + workingDir string // os.Environ filtered by the Exec.OsEnviron whitelist filter. baseEnviron []string + + npxInit sync.Once + npxAvailable bool +} + +func (e *Exec) New(name string, arg ...any) (Runner, error) { + return e.new(name, "", arg...) } // New will fail if name is not allowed according to the configured security policy. // Else a configured Runner will be returned ready to be Run. -func (e *Exec) New(name string, arg ...any) (Runner, error) { +func (e *Exec) new(name string, fullyQualifiedName string, arg ...any) (Runner, error) { if err := e.sc.CheckAllowedExec(name); err != nil { return nil, err } @@ -136,27 +147,51 @@ func (e *Exec) New(name string, arg ...any) (Runner, error) { copy(env, e.baseEnviron) cm := &commandeer{ - name: name, - env: env, + name: name, + fullyQualifiedName: fullyQualifiedName, + env: env, } return cm.command(arg...) } -// Npx will try to run npx, and if that fails, it will -// try to run the binary directly. +// Npx will in order: +// 1. Try fo find the binary in the WORKINGDIR/node_modules/.bin directory. +// 2. If not found, and npx is available, run npx --no-install . +// 3. Fall back to the PATH. func (e *Exec) Npx(name string, arg ...any) (Runner, error) { - r, err := e.npx(name, arg...) + // npx is slow, so first try the common case. + nodeBinFilename := filepath.Join(e.workingDir, nodeModulesBinPath, name) + _, err := safeexec.LookPath(nodeBinFilename) if err == nil { - return r, nil + return e.new(name, nodeBinFilename, arg...) + } + e.checkNpx() + if e.npxAvailable { + r, err := e.npx(name, arg...) + if err == nil { + return r, nil + } } return e.New(name, arg...) } +const ( + npxNoInstall = "--no-install" + npxBinary = "npx" + nodeModulesBinPath = "node_modules/.bin" +) + +func (e *Exec) checkNpx() { + e.npxInit.Do(func() { + e.npxAvailable = InPath(npxBinary) + }) +} + // npx is a convenience method to create a Runner running npx --no-install (\d+) \|`) + shouldImportRe = regexp.MustCompile(`^@import ["'](.*?)["'];?\s*(/\*.*\*/)?$`) +) + +type fileOffset struct { + Filename string + Offset int +} + +type importResolver struct { + r io.Reader + inPath string + opts InlineImports + + contentSeen map[string]bool + dependencyManager identity.Manager + linemap map[int]fileOffset + fs afero.Fs + logger loggers.Logger +} + +func newImportResolver(r io.Reader, inPath string, opts InlineImports, fs afero.Fs, logger loggers.Logger, dependencyManager identity.Manager) *importResolver { + return &importResolver{ + r: r, + dependencyManager: dependencyManager, + inPath: inPath, + fs: fs, logger: logger, + linemap: make(map[int]fileOffset), contentSeen: make(map[string]bool), + opts: opts, + } +} + +func (imp *importResolver) contentHash(filename string) ([]byte, string) { + b, err := afero.ReadFile(imp.fs, filename) + if err != nil { + return nil, "" + } + h := sha256.New() + h.Write(b) + return b, hex.EncodeToString(h.Sum(nil)) +} + +func (imp *importResolver) importRecursive( + lineNum int, + content string, + inPath string, +) (int, string, error) { + basePath := path.Dir(inPath) + + var replacements []string + lines := strings.Split(content, "\n") + + trackLine := func(i, offset int, line string) { + // TODO(bep) this is not very efficient. + imp.linemap[i+lineNum] = fileOffset{Filename: inPath, Offset: offset} + } + + i := 0 + for offset, line := range lines { + i++ + lineTrimmed := strings.TrimSpace(line) + column := strings.Index(line, lineTrimmed) + line = lineTrimmed + + if !imp.shouldImport(line) { + trackLine(i, offset, line) + } else { + path := strings.Trim(strings.TrimPrefix(line, importIdentifier), " \"';") + filename := filepath.Join(basePath, path) + imp.dependencyManager.AddIdentity(identity.CleanStringIdentity(filename)) + importContent, hash := imp.contentHash(filename) + + if importContent == nil { + if imp.opts.SkipInlineImportsNotFound { + trackLine(i, offset, line) + continue + } + pos := text.Position{ + Filename: inPath, + LineNumber: offset + 1, + ColumnNumber: column + 1, + } + return 0, "", herrors.NewFileErrorFromFileInPos(fmt.Errorf("failed to resolve CSS @import \"%s\"", filename), pos, imp.fs, nil) + } + + i-- + + if imp.contentSeen[hash] { + i++ + // Just replace the line with an empty string. + replacements = append(replacements, []string{line, ""}...) + trackLine(i, offset, "IMPORT") + continue + } + + imp.contentSeen[hash] = true + + // Handle recursive imports. + l, nested, err := imp.importRecursive(i+lineNum, string(importContent), filepath.ToSlash(filename)) + if err != nil { + return 0, "", err + } + + trackLine(i, offset, line) + + i += l + + importContent = []byte(nested) + + replacements = append(replacements, []string{line, string(importContent)}...) + } + } + + if len(replacements) > 0 { + repl := strings.NewReplacer(replacements...) + content = repl.Replace(content) + } + + return i, content, nil +} + +func (imp *importResolver) resolve() (io.Reader, error) { + content, err := io.ReadAll(imp.r) + if err != nil { + return nil, err + } + + contents := string(content) + + _, newContent, err := imp.importRecursive(0, contents, imp.inPath) + if err != nil { + return nil, err + } + + return strings.NewReader(newContent), nil +} + +// See https://www.w3schools.com/cssref/pr_import_rule.asp +// We currently only support simple file imports, no urls, no media queries. +// So this is OK: +// +// @import "navigation.css"; +// +// This is not: +// +// @import url("navigation.css"); +// @import "mobstyle.css" screen and (max-width: 768px); +func (imp *importResolver) shouldImport(s string) bool { + if !strings.HasPrefix(s, importIdentifier) { + return false + } + if strings.Contains(s, "url(") { + return false + } + + m := shouldImportRe.FindStringSubmatch(s) + if m == nil { + return false + } + + if len(m) != 3 { + return false + } + + if tailwindImportExclude(m[1]) { + return false + } + + return true +} + +func (imp *importResolver) toFileError(output string) error { + inErr := errors.New(output) + + match := cssSyntaxErrorRe.FindStringSubmatch(output) + if match == nil { + return inErr + } + + lineNum, err := strconv.Atoi(match[1]) + if err != nil { + return inErr + } + + file, ok := imp.linemap[lineNum] + if !ok { + return inErr + } + + fi, err := imp.fs.Stat(file.Filename) + if err != nil { + return inErr + } + + meta := fi.(hugofs.FileMetaInfo).Meta() + realFilename := meta.Filename + f, err := meta.Open() + if err != nil { + return inErr + } + defer f.Close() + + ferr := herrors.NewFileErrorFromName(inErr, realFilename) + pos := ferr.Position() + pos.LineNumber = file.Offset + 1 + return ferr.UpdatePosition(pos).UpdateContent(f, nil) + + // return herrors.NewFileErrorFromFile(inErr, file.Filename, realFilename, hugofs.Os, herrors.SimpleLineMatcher) +} diff --git a/resources/resource_transformers/postcss/postcss_test.go b/resources/resource_transformers/cssjs/inline_imports_test.go similarity index 85% rename from resources/resource_transformers/postcss/postcss_test.go rename to resources/resource_transformers/cssjs/inline_imports_test.go index 1edaaaaf52f..9bcb7f9a311 100644 --- a/resources/resource_transformers/postcss/postcss_test.go +++ b/resources/resource_transformers/cssjs/inline_imports_test.go @@ -1,4 +1,4 @@ -// Copyright 2020 The Hugo Authors. All rights reserved. +// Copyright 2024 The Hugo Authors. All rights reserved. // // Licensed under the Apache License, Version 2.0 (the "License"); // you may not use this file except in compliance with the License. @@ -11,7 +11,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -package postcss +package cssjs import ( "regexp" @@ -32,14 +32,14 @@ import ( // Issue 6166 func TestDecodeOptions(t *testing.T) { c := qt.New(t) - opts1, err := decodeOptions(map[string]any{ + opts1, err := decodePostCSSOptions(map[string]any{ "no-map": true, }) c.Assert(err, qt.IsNil) c.Assert(opts1.NoMap, qt.Equals, true) - opts2, err := decodeOptions(map[string]any{ + opts2, err := decodePostCSSOptions(map[string]any{ "noMap": true, }) @@ -67,6 +67,16 @@ func TestShouldImport(t *testing.T) { } } +func TestShouldImportExcludes(t *testing.T) { + c := qt.New(t) + var imp *importResolver + + c.Assert(imp.shouldImport(`@import "navigation.css";`), qt.Equals, true) + c.Assert(imp.shouldImport(`@import "tailwindcss";`), qt.Equals, false) + c.Assert(imp.shouldImport(`@import "tailwindcss.css";`), qt.Equals, true) + c.Assert(imp.shouldImport(`@import "tailwindcss/preflight";`), qt.Equals, false) +} + func TestImportResolver(t *testing.T) { c := qt.New(t) fs := afero.NewMemMapFs() @@ -95,7 +105,7 @@ LOCAL_STYLE imp := newImportResolver( mainStyles, "styles.css", - Options{}, + InlineImports{}, fs, loggers.NewDefault(), identity.NopManager, ) @@ -153,7 +163,7 @@ LOCAL_STYLE imp := newImportResolver( strings.NewReader(mainStyles), "styles.css", - Options{}, + InlineImports{}, fs, logger, identity.NopManager, ) diff --git a/resources/resource_transformers/postcss/postcss.go b/resources/resource_transformers/cssjs/postcss.go similarity index 50% rename from resources/resource_transformers/postcss/postcss.go rename to resources/resource_transformers/cssjs/postcss.go index 9015e120d1f..1a9e01142e1 100644 --- a/resources/resource_transformers/postcss/postcss.go +++ b/resources/resource_transformers/cssjs/postcss.go @@ -11,32 +11,23 @@ // See the License for the specific language governing permissions and // limitations under the License. -package postcss +// Package cssjs provides resource transformations backed by some popular JS based frameworks. +package cssjs import ( "bytes" - "crypto/sha256" - "encoding/hex" - "errors" "fmt" "io" - "path" "path/filepath" - "regexp" - "strconv" "strings" "github.com/gohugoio/hugo/common/collections" "github.com/gohugoio/hugo/common/hexec" "github.com/gohugoio/hugo/common/loggers" - "github.com/gohugoio/hugo/common/text" - "github.com/gohugoio/hugo/hugofs" - "github.com/gohugoio/hugo/identity" "github.com/gohugoio/hugo/common/hugo" "github.com/gohugoio/hugo/resources/internal" - "github.com/spf13/afero" "github.com/spf13/cast" "github.com/mitchellh/mapstructure" @@ -46,19 +37,12 @@ import ( "github.com/gohugoio/hugo/resources/resource" ) -const importIdentifier = "@import" - -var ( - cssSyntaxErrorRe = regexp.MustCompile(`> (\d+) \|`) - shouldImportRe = regexp.MustCompile(`^@import ["'].*["'];?\s*(/\*.*\*/)?$`) -) - -// New creates a new Client with the given specification. -func New(rs *resources.Spec) *Client { - return &Client{rs: rs} +// NewPostCSSClient creates a new PostCSSClient with the given specification. +func NewPostCSSClient(rs *resources.Spec) *PostCSSClient { + return &PostCSSClient{rs: rs} } -func decodeOptions(m map[string]any) (opts Options, err error) { +func decodePostCSSOptions(m map[string]any) (opts PostCSSOptions, err error) { if m == nil { return } @@ -74,23 +58,18 @@ func decodeOptions(m map[string]any) (opts Options, err error) { return } -// Client is the client used to do PostCSS transformations. -type Client struct { +// PostCSSClient is the client used to do PostCSS transformations. +type PostCSSClient struct { rs *resources.Spec } // Process transforms the given Resource with the PostCSS processor. -func (c *Client) Process(res resources.ResourceTransformer, options map[string]any) (resource.Resource, error) { +func (c *PostCSSClient) Process(res resources.ResourceTransformer, options map[string]any) (resource.Resource, error) { return res.Transform(&postcssTransformation{rs: c.rs, optionsm: options}) } -// Some of the options from https://github.com/postcss/postcss-cli -type Options struct { - // Set a custom path to look for a config file. - Config string - - NoMap bool // Disable the default inline sourcemaps - +type InlineImports struct { + // Service `mapstructure:",squash"` // Enable inlining of @import statements. // Does so recursively, but currently once only per file; // that is, it's not possible to import the same file in @@ -104,6 +83,16 @@ type Options struct { // Note that the inline importer does not process url location or imports with media queries, // so those will be left as-is even without enabling this option. SkipInlineImportsNotFound bool +} + +// Some of the options from https://github.com/postcss/postcss-cli +type PostCSSOptions struct { + // Set a custom path to look for a config file. + Config string + + NoMap bool // Disable the default inline sourcemaps + + InlineImports `mapstructure:",squash"` // Options for when not using a config file Use string // List of postcss plugins to use @@ -112,7 +101,7 @@ type Options struct { Syntax string // Custom postcss syntax } -func (opts Options) toArgs() []string { +func (opts PostCSSOptions) toArgs() []string { var args []string if opts.NoMap { args = append(args, "--no-map") @@ -156,13 +145,9 @@ func (t *postcssTransformation) Transform(ctx *resources.ResourceTransformationC var configFile string - var options Options - if t.optionsm != nil { - var err error - options, err = decodeOptions(t.optionsm) - if err != nil { - return err - } + options, err := decodePostCSSOptions(t.optionsm) + if err != nil { + return err } if options.Config != "" { @@ -219,11 +204,11 @@ func (t *postcssTransformation) Transform(ctx *resources.ResourceTransformationC imp := newImportResolver( ctx.From, ctx.InPath, - options, + options.InlineImports, t.rs.Assets.Fs, t.rs.Logger, ctx.DependencyManager, ) - if options.InlineImports { + if options.InlineImports.InlineImports { var err error src, err = imp.resolve() if err != nil { @@ -248,196 +233,3 @@ func (t *postcssTransformation) Transform(ctx *resources.ResourceTransformationC return nil } - -type fileOffset struct { - Filename string - Offset int -} - -type importResolver struct { - r io.Reader - inPath string - opts Options - - contentSeen map[string]bool - dependencyManager identity.Manager - linemap map[int]fileOffset - fs afero.Fs - logger loggers.Logger -} - -func newImportResolver(r io.Reader, inPath string, opts Options, fs afero.Fs, logger loggers.Logger, dependencyManager identity.Manager) *importResolver { - return &importResolver{ - r: r, - dependencyManager: dependencyManager, - inPath: inPath, - fs: fs, logger: logger, - linemap: make(map[int]fileOffset), contentSeen: make(map[string]bool), - opts: opts, - } -} - -func (imp *importResolver) contentHash(filename string) ([]byte, string) { - b, err := afero.ReadFile(imp.fs, filename) - if err != nil { - return nil, "" - } - h := sha256.New() - h.Write(b) - return b, hex.EncodeToString(h.Sum(nil)) -} - -func (imp *importResolver) importRecursive( - lineNum int, - content string, - inPath string, -) (int, string, error) { - basePath := path.Dir(inPath) - - var replacements []string - lines := strings.Split(content, "\n") - - trackLine := func(i, offset int, line string) { - // TODO(bep) this is not very efficient. - imp.linemap[i+lineNum] = fileOffset{Filename: inPath, Offset: offset} - } - - i := 0 - for offset, line := range lines { - i++ - lineTrimmed := strings.TrimSpace(line) - column := strings.Index(line, lineTrimmed) - line = lineTrimmed - - if !imp.shouldImport(line) { - trackLine(i, offset, line) - } else { - path := strings.Trim(strings.TrimPrefix(line, importIdentifier), " \"';") - filename := filepath.Join(basePath, path) - imp.dependencyManager.AddIdentity(identity.CleanStringIdentity(filename)) - importContent, hash := imp.contentHash(filename) - - if importContent == nil { - if imp.opts.SkipInlineImportsNotFound { - trackLine(i, offset, line) - continue - } - pos := text.Position{ - Filename: inPath, - LineNumber: offset + 1, - ColumnNumber: column + 1, - } - return 0, "", herrors.NewFileErrorFromFileInPos(fmt.Errorf("failed to resolve CSS @import \"%s\"", filename), pos, imp.fs, nil) - } - - i-- - - if imp.contentSeen[hash] { - i++ - // Just replace the line with an empty string. - replacements = append(replacements, []string{line, ""}...) - trackLine(i, offset, "IMPORT") - continue - } - - imp.contentSeen[hash] = true - - // Handle recursive imports. - l, nested, err := imp.importRecursive(i+lineNum, string(importContent), filepath.ToSlash(filename)) - if err != nil { - return 0, "", err - } - - trackLine(i, offset, line) - - i += l - - importContent = []byte(nested) - - replacements = append(replacements, []string{line, string(importContent)}...) - } - } - - if len(replacements) > 0 { - repl := strings.NewReplacer(replacements...) - content = repl.Replace(content) - } - - return i, content, nil -} - -func (imp *importResolver) resolve() (io.Reader, error) { - content, err := io.ReadAll(imp.r) - if err != nil { - return nil, err - } - - contents := string(content) - - _, newContent, err := imp.importRecursive(0, contents, imp.inPath) - if err != nil { - return nil, err - } - - return strings.NewReader(newContent), nil -} - -// See https://www.w3schools.com/cssref/pr_import_rule.asp -// We currently only support simple file imports, no urls, no media queries. -// So this is OK: -// -// @import "navigation.css"; -// -// This is not: -// -// @import url("navigation.css"); -// @import "mobstyle.css" screen and (max-width: 768px); -func (imp *importResolver) shouldImport(s string) bool { - if !strings.HasPrefix(s, importIdentifier) { - return false - } - if strings.Contains(s, "url(") { - return false - } - - return shouldImportRe.MatchString(s) -} - -func (imp *importResolver) toFileError(output string) error { - inErr := errors.New(output) - - match := cssSyntaxErrorRe.FindStringSubmatch(output) - if match == nil { - return inErr - } - - lineNum, err := strconv.Atoi(match[1]) - if err != nil { - return inErr - } - - file, ok := imp.linemap[lineNum] - if !ok { - return inErr - } - - fi, err := imp.fs.Stat(file.Filename) - if err != nil { - return inErr - } - - meta := fi.(hugofs.FileMetaInfo).Meta() - realFilename := meta.Filename - f, err := meta.Open() - if err != nil { - return inErr - } - defer f.Close() - - ferr := herrors.NewFileErrorFromName(inErr, realFilename) - pos := ferr.Position() - pos.LineNumber = file.Offset + 1 - return ferr.UpdatePosition(pos).UpdateContent(f, nil) - - // return herrors.NewFileErrorFromFile(inErr, file.Filename, realFilename, hugofs.Os, herrors.SimpleLineMatcher) -} diff --git a/resources/resource_transformers/postcss/postcss_integration_test.go b/resources/resource_transformers/cssjs/postcss_integration_test.go similarity index 97% rename from resources/resource_transformers/postcss/postcss_integration_test.go rename to resources/resource_transformers/cssjs/postcss_integration_test.go index 957e694038e..e8f52326cf3 100644 --- a/resources/resource_transformers/postcss/postcss_integration_test.go +++ b/resources/resource_transformers/cssjs/postcss_integration_test.go @@ -1,4 +1,4 @@ -// Copyright 2021 The Hugo Authors. All rights reserved. +// Copyright 2024 The Hugo Authors. All rights reserved. // // Licensed under the Apache License, Version 2.0 (the "License"); // you may not use this file except in compliance with the License. @@ -11,7 +11,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -package postcss_test +package cssjs_test import ( "fmt" @@ -181,7 +181,7 @@ func TestTransformPostCSSNotInstalledError(t *testing.T) { }).BuildE() s.AssertIsFileError(err) - c.Assert(err.Error(), qt.Contains, `binary with name "npx" not found`) + c.Assert(err.Error(), qt.Contains, `binary with name "postcss" not found using npx`) } // #9895 diff --git a/resources/resource_transformers/cssjs/tailwindcss.go b/resources/resource_transformers/cssjs/tailwindcss.go new file mode 100644 index 00000000000..f3195c5960a --- /dev/null +++ b/resources/resource_transformers/cssjs/tailwindcss.go @@ -0,0 +1,167 @@ +// Copyright 2024 The Hugo Authors. All rights reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +package cssjs + +import ( + "bytes" + "io" + "regexp" + "strings" + + "github.com/gohugoio/hugo/common/herrors" + "github.com/gohugoio/hugo/common/hexec" + "github.com/gohugoio/hugo/common/hugo" + "github.com/gohugoio/hugo/common/loggers" + "github.com/gohugoio/hugo/resources" + "github.com/gohugoio/hugo/resources/internal" + "github.com/gohugoio/hugo/resources/resource" + "github.com/mitchellh/mapstructure" +) + +var ( + tailwindcssImportRe = regexp.MustCompile(`^tailwindcss/?`) + tailwindImportExclude = func(s string) bool { + return tailwindcssImportRe.MatchString(s) && !strings.Contains(s, ".") + } +) + +// NewTailwindCSSClient creates a new TailwindCSSClient with the given specification. +func NewTailwindCSSClient(rs *resources.Spec) *TailwindCSSClient { + return &TailwindCSSClient{rs: rs} +} + +// Client is the client used to do TailwindCSS transformations. +type TailwindCSSClient struct { + rs *resources.Spec +} + +// Process transforms the given Resource with the TailwindCSS processor. +func (c *TailwindCSSClient) Process(res resources.ResourceTransformer, options map[string]any) (resource.Resource, error) { + return res.Transform(&tailwindcssTransformation{rs: c.rs, optionsm: options}) +} + +type tailwindcssTransformation struct { + optionsm map[string]any + rs *resources.Spec +} + +func (t *tailwindcssTransformation) Key() internal.ResourceTransformationKey { + return internal.NewResourceTransformationKey("tailwindcss", t.optionsm) +} + +type TailwindCSSOptions struct { + Minify bool // Optimize and minify the output + Optimize bool // Optimize the output without minifying + InlineImports `mapstructure:",squash"` +} + +func (opts TailwindCSSOptions) toArgs() []any { + var args []any + if opts.Minify { + args = append(args, "--minify") + } + if opts.Optimize { + args = append(args, "--optimize") + } + return args +} + +func (t *tailwindcssTransformation) Transform(ctx *resources.ResourceTransformationCtx) error { + const binaryName = "tailwindcss" + + options, err := decodeTailwindCSSOptions(t.optionsm) + if err != nil { + return err + } + + infol := t.rs.Logger.InfoCommand(binaryName) + infow := loggers.LevelLoggerToWriter(infol) + + ex := t.rs.ExecHelper + + workingDir := t.rs.Cfg.BaseConfig().WorkingDir + + var cmdArgs []any = []any{ + "--input=-", // Read from stdin. + "--cwd", workingDir, + } + + cmdArgs = append(cmdArgs, options.toArgs()...) + + // TODO1 + // npm i tailwindcss @tailwindcss/cli + // npm i tailwindcss@next @tailwindcss/cli@next + // npx tailwindcss -h + + var errBuf bytes.Buffer + + stderr := io.MultiWriter(infow, &errBuf) + cmdArgs = append(cmdArgs, hexec.WithStderr(stderr)) + cmdArgs = append(cmdArgs, hexec.WithStdout(ctx.To)) + cmdArgs = append(cmdArgs, hexec.WithEnviron(hugo.GetExecEnviron(workingDir, t.rs.Cfg, t.rs.BaseFs.Assets.Fs))) + + cmd, err := ex.Npx(binaryName, cmdArgs...) + if err != nil { + if hexec.IsNotFound(err) { + // This may be on a CI server etc. Will fall back to pre-built assets. + return &herrors.FeatureNotAvailableError{Cause: err} + } + return err + } + + stdin, err := cmd.StdinPipe() + if err != nil { + return err + } + + src := ctx.From + + imp := newImportResolver( + ctx.From, + ctx.InPath, + options.InlineImports, + t.rs.Assets.Fs, t.rs.Logger, ctx.DependencyManager, + ) + + // TODO1 option { + src, err = imp.resolve() + if err != nil { + return err + } + + go func() { + defer stdin.Close() + io.Copy(stdin, src) + }() + + err = cmd.Run() + if err != nil { + if hexec.IsNotFound(err) { + return &herrors.FeatureNotAvailableError{ + Cause: err, + } + } + return imp.toFileError(errBuf.String()) + } + + return nil +} + +func decodeTailwindCSSOptions(m map[string]any) (opts TailwindCSSOptions, err error) { + if m == nil { + return + } + err = mapstructure.WeakDecode(m, &opts) + return +} diff --git a/resources/resource_transformers/cssjs/tailwindcss_integration_test.go b/resources/resource_transformers/cssjs/tailwindcss_integration_test.go new file mode 100644 index 00000000000..ddd78b62f4b --- /dev/null +++ b/resources/resource_transformers/cssjs/tailwindcss_integration_test.go @@ -0,0 +1,72 @@ +// Copyright 2024 The Hugo Authors. All rights reserved. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +package cssjs_test + +import ( + "testing" + + "github.com/bep/logg" + "github.com/gohugoio/hugo/htesting" + "github.com/gohugoio/hugo/hugolib" +) + +func TestTailwindV4Basic(t *testing.T) { + if !htesting.IsCI() { + t.Skip("Skip long running test when running locally") + } + + files := ` +-- hugo.toml -- +-- package.json -- +{ + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/bep/hugo-starter-tailwind-basic.git" + }, + "devDependencies": { + "@tailwindcss/cli": "^4.0.0-alpha.16", + "tailwindcss": "^4.0.0-alpha.16" + }, + "name": "hugo-starter-tailwind-basic", + "version": "0.1.0" +} +-- assets/css/styles.css -- +@import "tailwindcss"; + +@theme { + --font-family-display: "Satoshi", "sans-serif"; + + --breakpoint-3xl: 1920px; + + --color-neon-pink: oklch(71.7% 0.25 360); + --color-neon-lime: oklch(91.5% 0.258 129); + --color-neon-cyan: oklch(91.3% 0.139 195.8); +} +-- layouts/index.html -- +{{ $css := resources.Get "css/styles.css" | css.TailwindCSS }} +CSS: {{ $css.Content | safeCSS }}| +` + + b := hugolib.NewIntegrationTestBuilder( + hugolib.IntegrationTestConfig{ + T: t, + TxtarString: files, + NeedsOsFS: true, + NeedsNpmInstall: true, + LogLevel: logg.LevelInfo, + }).Build() + + b.AssertFileContent("public/index.html", "/*! tailwindcss v4.0.0") +} diff --git a/resources/transform.go b/resources/transform.go index 9d8b5e915b8..b71c026b983 100644 --- a/resources/transform.go +++ b/resources/transform.go @@ -486,16 +486,20 @@ func (r *resourceAdapter) transform(key string, publish, setContent bool) (*reso if herrors.IsFeatureNotAvailableError(err) { var errMsg string - if tr.Key().Name == "postcss" { + switch strings.ToLower(tr.Key().Name) { + case "postcss": // This transformation is not available in this // Most likely because PostCSS is not installed. - errMsg = ". Check your PostCSS installation; install with \"npm install postcss-cli\". See https://gohugo.io/hugo-pipes/postcss/" - } else if tr.Key().Name == "tocss" { + errMsg = ". You need to install PostCSS. See https://gohugo.io/functions/css/postcss/" + case "tailwindcss": + errMsg = ". You need to install TailwindCSS CLI. See https://gohugo.io/functions/css/tailwindcss/" + case "tocss": errMsg = ". Check your Hugo installation; you need the extended version to build SCSS/SASS with transpiler set to 'libsass'." - } else if tr.Key().Name == "tocss-dart" { - errMsg = ". You need to install Dart Sass, see https://gohugo.io/functions/resources/tocss/#dart-sass" - } else if tr.Key().Name == "babel" { - errMsg = ". You need to install Babel, see https://gohugo.io/hugo-pipes/babel/" + case "tocss-dart": + errMsg = ". You need to install Dart Sass, see https://gohugo.io//functions/css/sass/#dart-sass" + case "babel": + errMsg = ". You need to install Babel, see https://gohugo.io/functions/js/babel/" + } return fmt.Errorf(msg+errMsg+": %w", err) diff --git a/tpl/css/css.go b/tpl/css/css.go index 145cb3aadac..48a526c1722 100644 --- a/tpl/css/css.go +++ b/tpl/css/css.go @@ -13,7 +13,7 @@ import ( "github.com/gohugoio/hugo/resources" "github.com/gohugoio/hugo/resources/resource" "github.com/gohugoio/hugo/resources/resource_transformers/babel" - "github.com/gohugoio/hugo/resources/resource_transformers/postcss" + "github.com/gohugoio/hugo/resources/resource_transformers/cssjs" "github.com/gohugoio/hugo/resources/resource_transformers/tocss/dartsass" "github.com/gohugoio/hugo/resources/resource_transformers/tocss/scss" "github.com/gohugoio/hugo/tpl/internal" @@ -27,7 +27,8 @@ const name = "css" type Namespace struct { d *deps.Deps scssClientLibSass *scss.Client - postcssClient *postcss.Client + postcssClient *cssjs.PostCSSClient + tailwindcssClient *cssjs.TailwindCSSClient babelClient *babel.Client // The Dart Client requires a os/exec process, so only @@ -63,7 +64,21 @@ func (ns *Namespace) PostCSS(args ...any) (resource.Resource, error) { return ns.postcssClient.Process(r, m) } -// Sass processes the given Resource with Sass. +// TailwindCSS processes the given Resource with tailwindcss. +func (ns *Namespace) TailwindCSS(args ...any) (resource.Resource, error) { + if len(args) > 2 { + return nil, errors.New("must not provide more arguments than resource object and options") + } + + r, m, err := resourcehelpers.ResolveArgs(args) + if err != nil { + return nil, err + } + + return ns.tailwindcssClient.Process(r, m) +} + +// Sass processes the given Resource with SASS. func (ns *Namespace) Sass(args ...any) (resource.Resource, error) { if len(args) > 2 { return nil, errors.New("must not provide more arguments than resource object and options") @@ -144,7 +159,8 @@ func init() { ctx := &Namespace{ d: d, scssClientLibSass: scssClient, - postcssClient: postcss.New(d.ResourceSpec), + postcssClient: cssjs.NewPostCSSClient(d.ResourceSpec), + tailwindcssClient: cssjs.NewTailwindCSSClient(d.ResourceSpec), babelClient: babel.New(d.ResourceSpec), }