Publish theme to NPM

[mchelen]

If you publish this theme to NPM with the name jsonresume-theme-cvstrap then anyone can use it without manually downloading it. If you want any help publishing an NPM package, feel free to let me know.

[carlvlewis]

First time publishing an NPM package, and while I'm sure I could hack it out, would love some brief guidance as I'm kind of slammed with other projects at the moment!

[carlvlewis]

Hey @mchelen, and I'm guessing I should change the name and extension of index.html to resume.template? Right?

[mchelen]

@carlvlewis Ah yep, that is the current filename used by index.js and would be consistent with other themes.

[carlvlewis]

So I successfully published the theme to NPM and it's appearing at http://themes.jsonresume.org/cvstrap, but it looks like i'm going to have to merge my CSS files into a single 'style.css' file in the root, which won't be impossible, but isn't ideal since I'd created separate print and screen stylesheets. Oh well... more CSS ...

[carlvlewis]

Also, @mchelen, mind checking the error returned (http://themes.jsonresume.org/cvstrap) to make sure that's the only thing I'm missing?

[mchelen]

@carlvlewis You can load multiple CSS files in index.js and pass them into the template. Look at how {{{css}}} variable is used in https://github.com/jsonresume/jsonresume-theme-boilerplate/blob/master/resume.template because you could easily have {{{css2}}} {{{css3}}} or {{{blah}}} as long as those variables are defined in index.js.

I think something is wrong with resume.template because I can see things like your name & twitter profile which shouldn't be hardcoded in the template.

[carlvlewis]

yeah those need to be set as variables from JSON... i just had those in HTML then changed filename to resume.template.

[carlvlewis]

and yeah i know i can have multiple stylesheets just going to be a couple of days until i get time to do that :)

[mchelen]

Ok sure, I can do the edits to index.js if that would help.

[carlvlewis]

Hey. yeah, that'd be awesome @mchelen! I'm taking out the manually inserted fields from resume.template now and also putting the CSS in a single file. You rock!

[mchelen]

If you are combining all the CSS into one file, then the current index.js can be used, just put the final style.css in the root directory. If you prefer to have the CSS in separate files though, let me know and I'll modify index.js.

Also for assets like bootstrap.js I'd recommend using CDN versions because it simplifies the repo and makes it easier to update versions.

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>

[carlvlewis]

@mchelen: Thanks for the thoroughness here! I've been busy with "real" work, so just getting to this. Yes, certainly, it makes more sense to use minified versions of the CSS and JS. Changing that now.

As for the index.js changes.which would be easier – that or compiling the CSS into a single style.css? (i know putting different stylesheets into a single file can get tedious with media@ and screen@ viewports and such, and, ideally, for clarity's sake and for users to be able to make changes quickly both to the print and screen stylesheets, I think it'd be optimal to keep them separated). Or would it be best to follow the official schema with a single style.css file in root that has the different stylesheets defined?

Let me know, and thanks again!

[carlvlewis]

Wait, couldn't the index.js changes just be as simple as calling up the location of each of the CSS files in order of priority?

So, instead of ...
var css = fs.readFileSync(__dirname + "/style.css", "utf-8");
it would be...
var css = fs.readFileSync(__dirname + "css/shared.css","css/screen.css", "css/print.css" "utf-8");
... or something in that manner? Obviously the bootstrap.min.css too.