@intouchg/tarot
v0.0.2
Published
Easy custom Webpack configs for SCSS and JS
Downloads
8
Readme
@intouchg/tarot
Easy custom Webpack configs for SCSS and JS
Features
- babel-loader
- webpack-bundle-analyzer
- CSS / SCSS entry files
- SCSS with PostCSS autoprefixer and media query sorting
- SCSS $env variable based on Webpack mode
Usage
- Set up your
webpack.config.js
using tarot:
// webpack.config.js
const { build } = require('@intouchg/tarot')
module.exports = build({
// Entry keys are used as the filename of the bundled output,
// with appropriate file extension automatically added, and
// are relative to the output directory.
// Entry values are used as the filepath of the entry file,
// and are relative to the source directory.
entries: {
bundle: 'index.js',
styles: 'index.scss',
['js/bundle-' + new Date().toISOString()]: 'index.js',
},
// Options
source: 'src2', // Source directory, default 'src'
output: 'dist2', // Output directory, default 'dist'
https: true, // Enable HTTPS, default false
cors: true, // Enable CORS, default false
copy: [ // Copy static assets, default []
{
from: 'assets', // Relative to the source directory
to: 'other' // Relative to the output directory
}
],
// Note: Webpack `context` is assumed to be process.cwd()
})
- Use
webpack-cli
and arguments to build:
webpack serve
webpack --mode development
webpack --analyze