meteor/website-tool

Name: website-tool

Owner: Meteor

Description: Internal tool we use to compile landing page sites.

Created: 2017-03-21 05:53:22.0

Updated: 2017-09-19 00:56:18.0

Pushed: 2017-10-24 07:07:51.0

Homepage: https://www.npmjs.com/package/maw

Size: 45

Language: JavaScript

GitHub Committers

UserMost Recent Commit# Commits

Other Committers

UserEmailMost Recent Commit# Commits

README

Make a Website (maw)

install maw

npm version

Make a static HTML page with some CSS, JS, and assets. Contains just the tools you need to write modern code and avoid repeating yourself. A gulpfile and webpack config in a box. It's written for internal needs, but I'd be happy to accept improvements if you find it useful too.

If you want to make a serious website with lots of pages, or you need a lot of customization or features, this is probably not going to work for you. You'll be much better served by something like Gatsby or Hexo.

This tool is 100% convention over configuration. Check out a site built with it here.

Using the tool

maw dev in the root of the project watches the /src directory, and puts the output in /build whenever files change.

maw build builds the site and puts the output in /build.

You probably want to npm install --save-dev maw and then add the above commands to a package.json, like in this site.

Directories

All of these are nested inside /src in the root of your project.

/public

This is for static files, which are copied directly into the output. That includes images, fonts, and pre-bundled libraries you want to use.

/index.less and /less

index.less is compiled into index.css. The /less directory is watched for LESS imports, so basically put everything except index.less in there.

/index.html and /templates

index.html is compiled into index.html and any handlebars code is evaluated against the files in /templates. The name of the template is the filename without the extension, for example nav.html can be included with {{> nav}}.

Multiple index.html files

You can nest multiple index.html files, for example /about/index.html, to give your website multiple pages.

/data.js

data.js should export any data you want to use in your handlebars templates, like so:

le.exports = {
llo: 'world',

And then you can use it with:

>
llo, {{hello}}!
v>
/index.js

index.js is a JavaScript entry point module that will be compiled with Webpack. Currently, no loaders are enabled.

TODO

This work is supported by the National Institutes of Health's National Center for Advancing Translational Sciences, Grant Number U24TR002306. This work is solely the responsibility of the creators and does not necessarily represent the official views of the National Institutes of Health.