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

How to Include Javascript #58

Closed
esiao opened this issue Aug 12, 2016 · 5 comments
Closed

How to Include Javascript #58

esiao opened this issue Aug 12, 2016 · 5 comments

Comments

@esiao
Copy link

esiao commented Aug 12, 2016

Hello, first thanks for this library great work, I'm happy to be able to use Jade/pug as my templating engine. I ran over an issue which I suppose is related to parsing. In pugJS you can include an external Javascript file in a template by writing

script
      include script.js

http://jade-lang.com/reference/includes/

However in pugPHP it's interpreting it as javascript and outputing

<script>
include script.js
</script>

Is it an easy fix? For now I will just put my script in a pug file and include it.

@kylekatarnls
Copy link
Member

kylekatarnls commented Aug 12, 2016

Hi,

Thanks for the report. Indeed, the equivalent syntax does not exist yet in pug-php. First remember that:

script(src="script.js")

is very often a better option since you benefit the browser cache.

For a complete and optimized way to handle your assets, I recommand you to use https://github.com/pug-php/pug-assets

Else, for the moment you can include a whole script:

include script

script.pug:

script.
  console.log('Foo bar');

@kylekatarnls
Copy link
Member

kylekatarnls commented Aug 12, 2016

I realize our unit tests are no longer up to date, the original jade-php repository I forked:

script
  if (foo) {
    bar();
  }

No dot after script.
Now in pugjs/pug:

script.
  if (foo) {
    bar();
  }

The script and style logice changed.

Update this feature could cause regressions for anyone using raw script and no dot after the tag name, but it's the right way to match pugjs.

I will think about the best way to implement this.

@esiao
Copy link
Author

esiao commented Aug 12, 2016

Thanks for the report. In this case I would just need to add the dot to match. The only reason why I would like to have my js as external javascript file is because of syntax highlight and eslint (in Atom).
The reason why I don't want to include it as a file is because it's a preloader script, inlining it assures me that it executes when I want it.

As for pug assets that's interesting (even more for the contact and minify options) but I'm not in a Symphony environment sadly. Thanks.

@kylekatarnls kylekatarnls added this to the 2.3 milestone Aug 12, 2016
@kylekatarnls
Copy link
Member

Oh I see the error in the REAME. pug-assets is used by pug-symfony. But it can also be used without, I will fix the README. Note that pug-assets use pug-minify (a keyword that you can also use alone).

You can right now try the fix on the branch include-script (use the version "dev-include-script" in composer), this will be merged with the version 2.3.

@kylekatarnls
Copy link
Member

2.3 is released. Thanks again for your help.

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

No branches or pull requests

2 participants