Last active
April 16, 2022 05:04
-
-
Save marianoviola/c9bbf5e80359df7d109bf73476475c2e to your computer and use it in GitHub Desktop.
Svelte style preprocessor using PostCSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import svelte from 'rollup-plugin-svelte'; | |
import resolve from 'rollup-plugin-node-resolve'; | |
import commonjs from 'rollup-plugin-commonjs'; | |
import buble from 'rollup-plugin-buble'; | |
import uglify from 'rollup-plugin-uglify'; | |
import postcss from 'postcss'; | |
import postcssImport from 'postcss-import'; | |
import postcssCssnext from 'postcss-cssnext'; | |
const production = !process.env.ROLLUP_WATCH; | |
export default { | |
input: 'src/main.js', | |
output: { | |
sourcemap: true, | |
format: 'iife', | |
file: 'public/bundle.js' | |
}, | |
name: 'app', | |
plugins: [ | |
svelte({ | |
// enable run-time checks when not in production | |
dev: !production, | |
// we'll extract any component CSS out into | |
// a separate file — better for performance | |
css: css => { | |
css.write('public/bundle.css'); | |
}, | |
// this results in smaller CSS files | |
cascade: false, | |
preprocess: { | |
style: ({ content, attributes }) => { | |
if (attributes.type !== 'text/postcss') return; | |
return new Promise((fulfil, reject) => { | |
const plugins = [postcssImport, postcssCssnext]; | |
const from = 'src'; | |
postcss(plugins) | |
.process(content, { | |
from, | |
map: { | |
inline: false | |
} | |
}) | |
.then(result => { | |
fulfil({ | |
code: result.css.toString(), | |
map: result.map.toString() | |
}); | |
}) | |
.catch(err => reject(err)); | |
}); | |
} | |
} | |
}), | |
// If you have external dependencies installed from | |
// npm, you'll most likely need these plugins. In | |
// some cases you'll need additional configuration — | |
// consult the documentation for details: | |
// https://github.com/rollup/rollup-plugin-commonjs | |
resolve(), | |
commonjs(), | |
// If we're building for production (npm run build | |
// instead of npm run dev), transpile and minify | |
production && buble({ exclude: 'node_modules/**' }), | |
production && uglify() | |
] | |
}; |
garkin
commented
Jul 14, 2018
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment