No blog, tags or other cruft;
just a single page for your content.
Installing and configuring Tulip is very easy. You'll get your site up and running in less than 5 minutes. There's nothing special about Tulip, it's just a Gridsome site, which is again is nothing more than some clever bits around Vue.
This short document is not intended to familiarize you with either of these tools, you should read Gridsome documentation and Vue documentation for more detailed information about respective projects.
gridsome create command to install Tulip:
gridsome create my-website https://github.com/Uninen/gridsome-starter-tulip.git
./gridsome.config.jsand fill in
siteName. You'll find other configurations (like title template and favicon) here as well.
./gridsome.config.js. If no ID is set, the plugin is not loaded at all. (You should, however, manually remove the associated entry in
package.jsonif you're not using it.)
As Tailwind Preflight styles are not meant to be used as is, Tulip comes with some very basic base styles (the ones you see on this page) that you can use or replace. These base styles live in
src/assets/css/base.postcss and are imported in
If you have existing styles you want to use, you can just copy them into
assets/css/ and import them (either in
main.js or in
Index.vue), or just add them in the style-section of the
(Note: if your existing styles aren't based on Tailwind, you'll probably want to remove the Tailwind plugin also as the Preflight normalizations are automatically imported and might affect your old styles.)
That's it, you're done! 🎉
gridsome developto start the local development server
You can host your built Gridsome site just about anywhere (it's just a static site). Netlify is one of the easiest and free ways for automatically deploy with every push. You can test it via this link and have your own deployment running in about a minute!
Vue + Gridsome is ❤️
© Ville Säävuori (@uninen) 2020, MIT License