svelte-starter-postcss

A starter for building Svelte web apps, with PostCSS supported.

Getting Started

Install using degit:

npx degit github:noprodev/svelte-starter-postcss your-project-folder
cd your-project-folder

Then, install the dependencies:

npm install

Use PostCSS in Your Svelte Project

• postcss-preset-env, PostCSS color-mod() Function and cssnano are enabled already.
• Add plugins as required (use postcss.config.js).
• You can use PostCSS in your static stylesheets AND Svelte components!

<!-- App.svelte -->
<style>
main {
    width: 35em;
    margin: 1.5em auto;
    /* Nesting */
    & > h1 {
        /* Color manipulation */
        color: color-mod(#0000ff shade(20%));
    }
}
</style>

<main>
   <h1>Hello World!</h1>
</main>

Building and Developing

Build

npm run build

Development

Development mode will:

• build on file change
• serve locally at localhost:5000
• live reload

npm run dev

Credits

Inspired by sveltejs/template