Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
Rothmanberger opened this issue Jan 15, 2019 · 2 comments

Comments

@Rothmanberger
Copy link

Rothmanberger commented Jan 15, 2019

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
Copy link
Owner

@Rothmanberger are you still experiencing this issue?

@yellowled
Copy link

@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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants