jQuery and Sanitize.css not auto-importing. JS scripts being run before CSS displayed

[Rothmanberger]

Describe the bug The scripts.js file is not automatically importing jQuery. I believe there is a part in your code in site.setup.js that attempts to this. The error I get is:

Uncaught ReferenceError: $ is not defined

When I manually import * as $ from 'jquery' at the top of my scripts.js file jQuery works.

Also, I have to manually @import '~sanitize.css' in my styles.scss file for it to be applied. Your site.setup.js file should also take care of this so I think these functions aren't being run?

Additionally, when I manually import these it appears the SCSS file is loaded in after the JS as for a brief moment when refreshing the page no styling is applied. When it does apply, CSS transitions that shouldn't occur on page load also occur.

To Reproduce Steps to reproduce the behavior:

1. Get a new static site boilerplate
2. During the setup select sanitize.css and choose to install jQuery
3. Get error in browser console when I run
4. Try manual setup again
5. Get same error

Expected behavior Expect CSS to display before JS waits for document to be ready. Expect jQuery and sanitize.css to automatically be imported into their respective scripts.js and styles.css file at build time.

Desktop (please complete the following information):

• OS: Windows 10
• Browser: Chrome and Firefox
• Version: Chrome Version 71.0.3578.98 (Official Build) (64-bit). Firefox 64.0.2 (64-bit)

[ericalli]

@Rothmanberger are you still experiencing this issue?

[yellowled]

@ericalli I do. (Using node 10.15.3 on macOS, maybe this did work correctly on node < 10?)

I took the liberty of testing it a bit – seems like site.setup.js can not (no longer?) find the stylesheet or script. If I change

fs.writeFile('./../src/stylesheets/styles.scss', cssContent, (err) => {});

to

fs.writeFile('./src/stylesheets/styles.scss', cssContent, (err) => {});

as well a the corresponding line for scripts.js, both the selected reset and jQuery dependency are inserted properly.