Lancer provides simple site-wide configuration via a site.config.js
file in your project's root folder. It looks something like this:
export default {
name: "My Website",
static: false,
origin: 'https://example.com',
locales: ['en'],
}
In this file you can specify several options, listed below.
When static
is set to true, running lancer build
will generate a full static website.
There is often common logic you will need to access throughout your pages. The locals
property is a good way to make functions and values available:
locals: {
myGlobalVariable: 'https://other.example.com',
myGlobalFunction(string) {
return '#' + string
}
},
With this, you now use the interpolation syntax {{}}
to make use of them:
<p>Lorem ipsum {{ myGlobalFunction('dolor') }}</p>
Don't think you have to define them inline! It's easy to expose an entire module instead:
import * as Links from './lib/links'
export default {
// ...
locals: {
Links
}
}
Although Lancer is html-based, that doesn't mean you can't have nice DSLs defined in your markup.
Use the templateTypes
to support <template>
tags with any type string you want:
export default {
// ...
templateTypes: {
'fancy-snippet'(templateBodyHtml, attrs) {
return renderCodeEditor(templateBodyHtml, attrs.lang)
}
}
}
Then, in any html file:
<template type="fancy-snippet" lang="rust">
fn main() {
println!("Hello, World!");
}
</template>
See Markdown Support for a full example.
Lancer uses esbuild to bundle your JS files. Although extremely fast, one downside is some modules are not compatible with the browser, due to node.js specific dependencies.
Fortunately, open source devs have written js-only version of many of these dependencies.
You can use bundleAliases
to re-map these imports to their browser-compatible counterparts. For example:
export default {
// ...
bundleAliases: {
'path': 'npm:path-browserify'
}
}
With this, any attempts to import path
in a JS bundle will now import path-browserify
instead.