andrewdavey / knapsack Goto Github PK

When Knapsack creates the modules and stores them in the isolated storage, more files are created then there modules.

In my case I have files for my .svn folders that are under scripts and styles folder, these are hidden folders and I think they should be ignored all the way. I have also a styles_images_da39a3ee5e6b4b0d3255bfef95601890afd80709 files, this is a folder under the styles folder, that contains the images but no css-files.

These modules can also be found in the manisfest xml-files.

So knapsack should ignore hidden folders and should not create modules for empty folders.

JavaScript libraries such as jQuery UI require CSS to render correctly. So perhaps allow a JS file to reference a CSS file. Then the page only needs to reference the JS file and the required CSS module is also added.

It's not a big issue, but I've had the 'The given key was not present in the dictionary' exception a few times and it always takes me a while to find where I have a wrong tag or in what module.txt I made an error.

The exception should be more like:

The script file jquery-1.6.0.js referenced in mycustom.js could not be found. In order to solve this, put the jquery-1.6.0.js in a module or rename the reference to a file that does exist.

It's not a high priority issue, but I it will help people in using Knapsack.

It seems that knapsack interferes with glimpse or I don't know the correct knapsack config!. (http://getglimpse.com/)

To repro:

1. New MVC3 project.
2. Use Nuget to install Glimpse MVC3
3. Ensure Glimpse running OK
4. Set Project to use IIS Express
   --> Run website in Debugger - Glimpse works OK
5. Use Nuget to install Knapsack
   --> Run website in debugger - Glimpse doesn't work. Blank screen shown in browser.

In my Lib folder I have the following script files:

jquery-1.6.1.js
jquery-ui-1.8.13.js
jquery-ui-extra.js
json2.js

This is also the contents of my module.txt file, and I expect it to create a combined script in the same order. But this din't happen, because in my jquery-ui-extra.js file I had the following reference:

///

Because of that the combined script had the following order:

jquery-ui-1.8.13.js
jquery-1.6.1.js
jquery-ui-extra.js
json2.js

Changing my references solved it, now I have this in my jquery-ui-extra.js file:

///
///

But in my opinion the module.txt should be master of the order and shoul ignore the references in the files.

When using KnockoutJS, it's common to have a lot of HTML templates. I find these easier to maintain as individual files. Let's find a way to make Knapsack package the templates into a module, just like for CSS and JS.

Hi,

Any chance of supporting Sass files as well?

Perhaps the "SassAndCoffee" nuget package (http://nuget.org/List/Packages/SassAndCoffee) can be used for this?

Allow external references, such as:
Html.ReferenceScript("http://platform.twitter.com/widgets.js");

Naive implementation can just put them after all internal scripts. A better implementation will allow dependencies to be taken on the external script, meaning it has to be sorted correctly with the internal scripts.

It may be better to keep the external URLs in the web.config, rather than in every partial/view that uses them. Adding a "module" reference feature could help here.
Html.ReferenceScriptModule("twitter-api");

In the config:
<add path="twitter-api" url="http://platform.twitter.com/widgets.js" />

In stylesheets you can have the following:

div#header
{
background: #325b89 url(images/header-background.png) repeat-x top;
}

The images folder is a relative path starting from the stylesheet itself. But when the stylesheet is minified and combined and called via /knapsack.axd, the relative path isn't correct anymore. Because the image is now search on the following path:

/knapsack.axd/styles/Content/images/header-background.png

A nice feature for knapsack would be that the knapsack.axd returns the image.

I am attempting to add Knapsack to an existing application that uses WebForms rather than MVC3. I see the relevant methods are extensions on the MVC.HtmlHelper class. Is it possible to use Knapsack in WebForms and, if so, how?

I'd love to see support for protocol relative URLs for external scripts - http://paulirish.com/2010/the-protocol-relative-url/

Web/Manager.cs line 140

One idea I had is adding a location parameter or a string code so that you can call @Html.ReferenceScript("top", "~/myscript.js") and then in your header call @Html.RenderScripts("top") and in your footer call @Html.RenderScripts("bottom"). This way you could push all async loading scripts to the top and blocking scripts to the bottom. I can fork and submit a pull if you think this is a good way to handle it.

In my index.cshtml, I have the following

@{
    ViewBag.Title = "File Manager";
    Html.AddScriptReference("Content/js/app.files.js");
}

and at the top of app.files.js, I have the following

/// <reference path="app.init.js" />
/// <reference path="common.date.js" />
/// <reference path="jquery.tmpl.min.js" />
/// <reference path="jquery.ba-bbq.min.js" />
/// <reference path="jquery.ba-throttle-debounce.min.js" />

but then I was moving stuff around and decided to take the last three references out since they are already minified and never change and really used by every page in my app. So now, the top of app.files.js looks like:

/// <reference path="app.init.js" />
/// <reference path="common.date.js" />

However, I'm noticing that when I run my app and view source, I see:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>
<script type="text/javascript" src="/Content/js/modernizr-1.7.min.js"></script>
<script type="text/javascript" src="/Content/js/jquery.ba-bbq.min.js"></script>
<script type="text/javascript" src="/Content/js/jquery.ba-throttle-debounce.min.js"></script>
<script type="text/javascript" src="/Content/js/jquery.tmpl.min.js"></script>
<script src="/Content/js/app.init.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/common.date.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/app.files.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/jquery.ba-bbq.min.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/jquery.ba-throttle-debounce.min.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/jquery.tmpl.min.js?nocache=634409743120466301" type="text/javascript"></script>
<script src="/Content/js/modernizr-1.7.min.js?nocache=634409743120466301" type="text/javascript">script>

So, as you can see, even though I'm manually referencing the files in my _Layout.cshtml, and even though they are no longer referenced in app.files.js, somehow Knapsack is still adding them in there. It's like its not clearing its cache or something. Or perhaps I'm just doing something wrong.

Knapsack adds Html.RenderScripts() and Html.RenderStylesheetLinks(). These are returning IHtmlString and used like
@Html.RenderScripts()

This differs from the MVC helpers, such as @Html.Partial("name") vs @{ Html.RenderPartial("name"); }

Should Knapsack's API be updated to remove the "Render" prefix from the helper names?

I keep getting a Resource not found error for my CSS files

I'm including one from my Site.Master in my ASP.NET MVC files.

I have this line:

<% Html.ReferenceStylesheet("Content/themes/base/jquery.ui.all.css"); %>

the file /Content/themes/base/jquery.ui.all.css does, indeed exist.

What am I doing wrong?

I wrote a lot of unit tests for Knapsack on the train without access to Moq, so there are many hand-rolled mock objects in there!
Let's refactor the code to use Moq mocks instead. For sanity!