search

h5bp / html5-boilerplate

A professional front-end template for building fast, robust, and adaptable web apps or sites.
https://html5boilerplate.com/
MIT License
56.39k stars 12.22k forks source link

Relative ../ js and css links get wiped out on compression. #839

Closed lazukars closed 12 years ago

lazukars commented 12 years ago

This happens when you have a file in a a sub folder example/index.html that has relative links pointing up one directory.

Say my file example/index.html has the following code:

 <link rel="stylesheet" href="../css/style.css" />
 <script src="../js/plugins.js"></script>

The ant script will strip those ../ relative links out, and it will look something like this:

 <link rel=stylesheet href='css/7d3586f292b65c896ef495e2e8ef042901d7c2e2.css'>
 <script src="js/7d3586f292b65c896ef495e2e8ef042901d7c2e2.js"></script>

There is a Stackoverflow question about this ( below ), but the answer does not solve the problem. If you do what the answer states, the build script still strips out the ../ relative links.

http://stackoverflow.com/questions/7554309/html5-boilerplate-build-script-html-in-subfolders-and-relative-links-to-css-js

mklabs commented 12 years ago

hi @lazukars, please see commits here testing out this issue.

I'm a little bit confused about what your problem is, can you tell us which version of ant are you using, also is the build script sync with master?

As far as I could test, it is working for me. See the article/ folder with the relative links. The generated files in publish/ have the according relative paths.

I've tested it with both file.pages.default.include = index.html, article/**/*.html and file.pages.default.include = index.html, article/stuff/index.html, article/stuff-bis/index.html. Both are generating the same results on this basic test case.

meglio commented 12 years ago

The same happens to me. Using boilerplate version 2 officially available on the site.

Original:

<link rel="stylesheet" href="/css/style.css"/>
<link rel="stylesheet" href="/css/date-input.css"/>
<link rel="stylesheet" href="/css/tooltip.css"/>

Result:

<link rel='stylesheet' href='css/331dad093dddc005b864db969f14ee028f7c6bf0.css'>
  1. The protocol-agnostic prefix is missing: href="/......"
  2. Also, the close tag is now missing (and it does not work with PHPTAL because of this problem, btw)
meglio commented 12 years ago

Btw, the same problem happens to js concatenation file, the protocol agnostic prefix "/" gets missing:

<script defer src='js/32175f8b50eba40b5921328bbb29473c9eaf40bb.js'></script>

... while the source was:

<!-- scripts concatenated and minified via ant build script-->
  <script defer="defer" src="/js/plugins.js"></script>
  <script defer="defer" src="/js/script.js"></script>
  <script defer="defer" src="/js/libs/jstree/jquery.jstree.js"></script>
<!-- end scripts-->
mklabs commented 12 years ago

Ok, confirmed with download archive.

Can you guys test it with latest build.xml from master?

Seems like #686 and #685 are related. The script have evolved quite a bit since the v2 tag (compare).

@darktable did an amazing job on this, maybe it's already fixed. I'm assuming here the issue is similar.

meglio commented 12 years ago

Is it safe to switch to non-announced revision from master branch for commercial project?

addyosmani commented 12 years ago

@meglio @lazukars just pinging to find out if there were any updates to @mklabs question available :)

heff commented 12 years ago

I just copied over the latest version of the build directory into my project and it fixed this issue for me. (I'm using site relative URLs, e.g. /css/style.css)