TypeScript & NPM
Powered by Vite. Organize your logic in the
ts/ directory and tap into the massive NPM ecosystem.
1
The ts/ Directory
For best practices and code organization, all your TypeScript logic should
reside in the
root ts/ directory. Vite watches this folder
and automatically compiles your code for production.
ts/to-money.ts
export
function
toMoney(
value: number
): string
return `$$value.toFixed(2)`;
value: number
): string
return `$$value.toFixed(2)`;
2
Use Any NPM Package
Because Caspian uses Vite, you have full access to the Node ecosystem. Install any package and import it directly into your files.
➜
npm install date-fns
ts/date-utils.ts
import format
from
"date-fns";
export function getToday()
return format(new Date(), "yyyy-MM-dd");
export function getToday()
return format(new Date(), "yyyy-MM-dd");
3
Register in Main
Import your utilities in the entry file ts/main.ts and
register them.
ts/main.ts
import createGlobalSingleton
from
"./global-functions";
import toMoney from "./to-money";
createGlobalSingleton("toMoney", toMoney);
import toMoney from "./to-money";
createGlobalSingleton("toMoney", toMoney);
4
Usage
Your registered functions are now available globally in Mustache templates and PulsePoint scripts.
src/index.html
<!-- Mustache -->
<p>To Money: toMoney(1234.56)</p>
<p>My Money: myMoney</p>
<!-- Script -->
<script>
const [myMoney, setMyMoney] = pp.state(toMoney(15245));
</script>
<p>To Money: toMoney(1234.56)</p>
<p>My Money: myMoney</p>
<!-- Script -->
<script>
const [myMoney, setMyMoney] = pp.state(toMoney(15245));
</script>