Andy-set-studio / learneleventyfromscratch.com

In this Eleventy course, we go from a completely empty directory to a full-blown marketing site for a design agency, and along the way, we dive really deep into Eleventy and front-end development best practices.
https://learneleventyfromscratch.com/
120 stars 28 forks source link

Error: template not found: css/critical.css on Windows #12

Closed heyitstay11 closed 2 years ago

heyitstay11 commented 2 years ago

I am at lesson 19 : Setting up SASS

running npm start throws an error

 Having trouble writing template: dist/about-us/index.html

`TemplateWriterWriteError` was thrown
 Template render error: (./src/_includes/layouts/about.html)
  Error: template not found: css/critical.css

Tested on Windows 10
npm --version: 6.14.11\ node --version: 14.16.0
and Windows 7\ npm --version: 6.14.8\ node --version: 14.15.1


The problem is Regex in file /gulp-tasks/sass.js \ History array return the file path in windows filepath format in Windows\ Current regex does not work for matching filenames in Windows filepath format\ sass never creates a css directory inside /src/_includes directory

Present Code:

 const sourceFileName = /[^/]*$/.exec(history[0])[0]; 
 // only matches last element after / in the file path 
 // (works for Unix file format, fails for windows)

Modify it to :

  const sourceFileName = /[^(/|\\)]*$/.exec(history[0])[0]; 
  // matches last element after / and \ in the the file path 
  // (works for both file formats)

  /*
        [^          Matches any character not in the square brackets
            (       Creating a group 
                /   Match the / character
                |   Alternation. Matches either the character before or after the symbol
                \\  Match the \ character and one extra \ for escaping the backslash
            )   
        ]
        *           Matches 0 or more repetition
        $           Matches the end of string
  */

Demo:

output
Andy-set-studio commented 2 years ago

Fixed with #13