Blows up for CSS about express-cdn HOT 16 CLOSED

can you post your code snippet where you require express-cdn and pass app/options to it?

also what version of express-cdn are you using? the latest is 0.0.3

from express-cdn.

Hi - I am using 0.3.3. It works fine for js ...

https://gist.github.com/3081252

from express-cdn.

Same issue when I try to use the CDN helper to replace the img path for:

<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/img/apple-touch-icon-144x144.png" />

from express-cdn.

can you share your code snippet for the CSS?

also, we don't have functionality built in for link selectors that are non-CSS

we'd love a pull request though :)

from express-cdn.

Should be in the gist ... Here it is again:

<%- CDN([ '/css/bootstrap.min.css', '/css/app.css' ]) %>

from express-cdn.

the CSS part works by issuing a HTTP request to the host + port options followed by the full path given in the CDN helper (e.g. /css/bootstrap.min.css). The body of the HTTP GET request is processed etc.

According to your config, try visiting these URL's and seeing if CSS is loading OK.

http://hatchetapp.net:1337/css/bootstrap.min.css
http://hatchetapp.net:1337/css/app.css

I recommend that you change your S3 credentials since you posted them publicly and that is a security risk.

from express-cdn.

Ah - that is what that bit of configuration for ... the hostname and port. And CSS is different to JS because of the less functionality - ok ... I get it. Thank you. On that note - my dev and production have different setups - what is the neatest way for me to set up this functionality for the different environments. (sorry - still very new to node).

And yeah - thanks for the security risk notice - it's still dark here early morning and am about to have my first cup of coffee.

from express-cdn.

I utilize a config.json file, here is an example of its contents:

{
  "development": {
    "port": 1337,
    "hostname": "localhost"
  },
  "production": {
    "port": 80,
    "hostname": "mysite.com"
  }
}

Then when your server starts, you simply require it and pass an environment variable (example given below):

var env = process.env.NODE_ENV || 'development';
var port = process.env.PORT || config[env].port;
var config = require('./config')[env];

// you can then configure your app like this, and add all your credentials in the config file
var options = {
    publicDir  : path.join(__dirname, 'app')
  , viewsDir   : path.join(__dirname, 'app')
  , domain     : config.domain
  , bucket     : config.bucket
  , key        : config.S3.key
  , secret     : config.S3.secret
  , hostname   : config.hostname
  , port       : config.port
  , ssl        : config.ssl
  , production : (env === 'production') ? true : false
};

// Initialize the CDN magic
var CDN = require('express-cdn')(app, options);

// more stuff ...

app.listen(port);

Also, instead of using a JSON file and adhering to the quoted format etc., you could create a file called config.js and utilize it (e.g. var config = require('./config')[env]):

module.exports = {
  // configuration here without worrying about the quotes
  development: {
    // ...
  },
  production: {
    // ...
  }
};

from express-cdn.

Cool - thanks for that!

from express-cdn.

One issue that still remains ... when I push the CSS to the CDN - and access it say using assets.myapp.com ... the images I refer to inside the CSS refer to /img/myimage.png ... which translates to assets.myapp.com/img/myimage.png - so they refer to the assets hostname - which is my CDN - but not where my CSS images are ... How do I resolve this? Is there something built into this that can handle this situation?

from express-cdn.

Yes we have not yet built in the CSS parser yet for images (e.g. background-image: url(/some/image.png)) -- however, this feature is planned!

from express-cdn.

1. this project is amazing.. thank you for making it
2. does this mean it's useless if you're using background-image in css? do you need to specify them in css that does not get passed into express-cdn? am I missing something painfully obvious? simply make sure to put the images into the CDN?

from express-cdn.

RE @jmonster:

1. Thank you!
2. Currently only tags utilize express-cdn, however we anticipate someone will soon integrate filters to CSS/LESS/Sass/Stylus that will parse stylesheets and convert instances of background-image: != CDN('/some/image.png') to the appropriate S3 URL or local value. Currently you should not be using != CDN(...) in any of your stylesheets. You can however use it in place of tags, e.g. != CDN('/some/image.png') will render <img src="/some/image.png?v=1234567890" /> (w/dynamic timestamp in development mode) and in production mode <img src="http://cdn.your-domain.com/some/image.png" /> -- see Readme for accurate examples

from express-cdn.

I'm going to add in a lazyweb request for this stuff.

from express-cdn.

Here's an example if anyone can build out this lazyweb request feature:

https://github.com/niftylettuce/express-cdn/tree/eeccfaf2efc643240df92d86e28c8b9c10fd6f19#requests

from express-cdn.

See pull request here: #18

from express-cdn.