Snowpack is a tool for building web applications with less tooling and 10x faster iteration. Snowpack comes with a starter generator called Create Snowpack App, it has official plugins for most of the frameworks.
But what if we wanted to build a custom community plugin?
You can use create-snowpack-app
with:
npx create-snowpack-app dir-name --template template-name
You are excused if this feels familiar to a popular react tool.
A community starter is a repository that you get to maintain using Snowpack and published to NPM (or any of the other hosted services). You can initialise a new project using your template and CSA.
If your template is called my-custom-template
and hosted to NPM, you would be able to use it with:
npx create-snowpack-app dir-name --template my-custom-template
First, we will start with a basic template:
npx create-snowpack-app my-custom-template --template @snowpack/app-template-blank
Now CSA will intialise a repository named my-custom-template
that contains the snowpack template @snowpack/app-template-blank
. Now you can proceed to make changes you want in the template.
I'm just choosing to start with blank
, you can choose to start with any other template
Give it a name in package.json
, this is also your template name.
{
"name": "my-custom-template"
}
Note that this name needs to be unique in the NPM package registry. You can also scope it to something like @npmuser@my-custom-template
, these are known as scoped packages.
Give it a version.
{
"version": "0.0.1"
}
CSA requires the template to have a specific keyword: csa-template
.
{
"keywords": ["csa-template"]
}
There are several articles and videos if you are not familar with publishing or haven't done this before. But the basic idea is:
npm login
npm publish
You can also use one of the several tools that help with this process. One of my absolute favorites is np.
You can now use the template as mentioned with:
npx create-snowpack-app dir-name --template my-custom-template
Have fun 🎉