URL structure

[andymcfee]

Is it possible to customize the URL and output structure of the pages so that instead of url.com/about.html would be url.com/about/ (which is obviously url.com/about/index.html)?

I'm wondering if this is the ext: option, but I haven't found any examples as to how this would be possible.

If I need to ask this somewhere else, let me know. Thanks!

[kristijanhusak]

How you serve your pages is up to server, not the extension. If you use apache or nginx or node server with gulp, and set proper rewrite methods, than it will work, but it definitely has nothing to do with extension or this plugin.

Here are some links to help you out:

nginx:

• http://stackoverflow.com/questions/21911297/how-to-remove-both-php-and-html-extensions-from-url-using-nginx

Node:

• https://www.npmjs.com/package/gulp-connect
• https://www.npmjs.com/package/connect-modrewrite

[andymcfee]

Thanks for the info. I think though I might have worded my question wrong. What I'm wanting if for my pages to build a specific way.

app/pages/foo.nunjucks :arrow_right: dist/foo/index.html app/pages/bar/baz.nunjucks :arrow_right: dist/bar/baz/index.html

Is this possible or am I still outside of the scope of this project?

[kamlekar]

That happens if you write in gulp like that.

give source and destination as I mentioned below:

source: app/pages/ destination: dist/

[andymcfee]

@kamlekar correct me if I'm wrong, but wouldn't that result in:

app/pages/foo.nunjucks :arrow_right: dist/foo.html app/pages/bar/baz.nunjucks :arrow_right: dist/bar/baz.html

My goal is for [NAME].nunjucks to compile to [NAME]/index.html.

[kamlekar]

oh sorry. I got it. You can still do that by writing gulp script. give me sometime.

[kamlekar]

@andymcfee

:+1: I thought it is achievable. Tried till now but didn't succeed.

Would be great to have this feature.

[andymcfee]

@kamlekar ok, at least I'm not off base.

Now, would it be a feature of this project or of nunjucks proper?

[kamlekar]

I see possibility to add this feature to this project. @kristijanhusak what do you say?

[kristijanhusak]

@andymcfee , why you need that kind of structure?

You could add some logic with gulp-rename to achieve that.

[kamlekar]

@kristijanhusak Since gulp-nunjucks-render is for UI people, I suggest having an option in this project which lets user to do as mentioned by @andymcfee

[andymcfee]

@kristijanhusak I am using nunjucks + gulp as a static site generator. @kamlekar was correct in that I'm a UI developer. Most of the projects I work on are database-less sites so SSGs are essential to my workflow. I've used Jekyll, Assemble.io, and most recently Metalsmith, all of which have some kind of option/extension to configure the out structure of pages (ex: Jekyll, Assemble, Metalsmith). The reason I'm looking into nunjucks now is that none of the other SSGs work really well with Gulp, and Nunjucks seems a perfect fit.

Also, since I'm just generating static files, configuring a server to format the URL is a bit outside of the scope of what I need to do.

A simple option to enable permalinks or configure the output structure would be a huge plus. Yes, technically I could use gulp-rename to rename every file, but in a project with hundreds of pages, this could prove a bit of a burden on the build process, especially since pages compile on watch of nunjucks files.

I'm happy to help out anyway I can with feedback or any sort of testing if need be. :+1:

[carlitoplatanito]

@andymcfee Don't know if you have figured this out already but it's actually pretty easy. I was actually surprised it worked, but just set the extension as "/index.html":

nunjucksRender({ data: your_data, ext: "/index.html", path: base_path})

[carlitoplatanito]

@andymcfee one more thing, you will probably want to rename "index/index.html" I use fs-extra node module for that and run the following task after nunjucks is done (use run-sequence node module or callback).

fs = require('fs-extra');

gulp.task('nunjucks-rename-index', function() {
  fs.move(
    output_path + "index/index.html", 
    output_path + "index.html", 
    { clobber: true },
    function(err) {
      if (err) return console.log(err);
      fs.remove(output_path + "index");
    }
  );
});

[kamlekar]

@carlosl Wow so the magic thing is this:

.pipe(nunjucksRender({
        ext: '/index.html',
        // other options
}))

Thanks. Wouldn't it be better to mention this in readme file? I think this counts as basic thing which any UI developer wants to have. I am saying to mention this because neither me nor @andymcfee were able to figure it out the code.

[carlitoplatanito]

@kamlekar, yes I'll consider documenting it. I just never considered even doing it till I saw this question.