ProjectEvergreen / greenwood

Greenwood is your full-stack workbench for the web, focused on supporting modern web standards and development to help you create your next project.
https://www.greenwoodjs.io
MIT License
94 stars 9 forks source link

bug/issue 1199 gracefully handle unresolvable asset URLs during CSS optimization #1235

Closed thescientist13 closed 2 weeks ago

thescientist13 commented 1 month ago

Related Issue

relates to #1199

Observed that in some cases, like when using postcss-import plugin and having all styles inlined, there will be a "loss" of reference point for where to look for files, when these dependencies use relative paths, e.g. https://unpkg.com/browse/font-awesome@4.6.3/css/font-awesome.css

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.6.3');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.6.3') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.6.3') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.6.3') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

Which will then cause Greenwood to fail the build

Error: ENOENT: no such file or directory, open '/Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/src/fonts/fontawesome-webfont.eot'
    at Object.openSync (node:fs:596:3)
    at Object.readFileSync (node:fs:464:35)
    at Object.enter (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/@greenwood/cli/src/plugins/resource/plugin-standard-css.js:56:36)
    at walkNode (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:169:36)
    at List.walkReducer (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:195:61)
    at List.reduce (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/utils/List.js:174:22)
    at Object.Value (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:103:31)
    at walkNode (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:180:41)
    at Object.Declaration (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:108:28)
    at walkNode (file:///Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/node_modules/css-tree/lib/walker/create.js:180:41) {
  errno: -2,
  syscall: 'open',
  code: 'ENOENT',
  path: '/Users/owenbuckley/Workspace/analogstudiosri/www.analogstudios.net/src/fonts/fontawesome-webfont.eot'

Also, needed is to handle data: URLs. https://unpkg.com/browse/bootstrap@4.0.0-alpha.4/dist/css/bootstrap.css

.has-success .form-control-success {
  background-image: url("data:image/svg+xml;...");
}

Summary of Changes

  1. For url paths Greenwood can't locate, emit a warning
  2. Don't try and optimize data: URLs
  3. Added test cases for both