alephjs/aleph.js

src dir breaks CSS @import

tv42 opened this issue · 0 comments

tv42 commented

Following https://github.com/alephjs/aleph.js/tree/master/examples/with-src-dir/src, I am led to believe I can put source code in src directory.

This breaks CSS files with @import. The @import is not interpreted, and shows up literally in the result, with warnings about trying to read the imported CSS file in the wrong place.

$ aleph init good
Using VS Code? [y/n] n
Deploy to Vercel? [y/n] n
[...]
$ cd good
good$ aleph dev &
good$ curl -s localhost:8080|grep -A 3 '<style'
  <style type="text/css" data-module-id="/style/index.css" ssr>/* style/reset.css */
* {
  margin: 0;
  padding: 0;
$ aleph init bad
Using VS Code? [y/n] n
Deploy to Vercel? [y/n] n
[...]
$ cd bad
bad$ mkdir src
bad$ mv app.tsx api components lib pages style src/
bad$ aleph dev &
INFO Start watching code changes...
INFO Server ready on http://localhost:8080/
 > style/index.css:1:12: error: Could not read from file: /blah/bad/style/reset.css
    1 │ @import url('./reset.css');
      ╵             ~~~~~~~~~~~~~

INFO render '/' in 83ms
INFO render '/reset.css' in 10ms
bad$ curl -s localhost:8080|grep -A 3 '<style'
  <style type="text/css" data-module-id="/style/index.css" ssr>@import url('./reset.css');

main {
  display: flex;

Leaving style outside of src doesn't really work, because now index.tsx is expecting it in src/style. Changing the <link href does not work either, ERROR panicked at 'called Option::unwrap()on aNone value', src/resolver.rs:346:10