diff --git a/LICENSE b/LICENSE index 2071b23..ddb280e 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) +Copyright (c) 2024 Björn Hase, me@herr-hase.wtf Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: diff --git a/README.md b/README.md index 8282541..ce379ae 100644 --- a/README.md +++ b/README.md @@ -25,3 +25,25 @@ module.exports = tinyComponentsWebpack({ } }) ``` + +## Plugin: RiotJS + +For using RiotJS, install compiler and webpack-loader + +``` +npm install @riotjs/compiler @riotjs/webpack-loader --save-dev +``` + +And adding a rule for RiotJS, + +``` +const tinyComponentsWebpack = require('@tiny-components/webpack') +const riotPlugin = require('@tiny-components/webpack/rules/riot') + +module.exports = tinyComponentsWebpack({ + critical: [ './resources/js/critical.js' ], + styles: [ './resources/scss/styles.scss' ], +}, { + rules: [ riotRules ] +}) +``` diff --git a/index.js b/index.js index 539f115..f61b28f 100644 --- a/index.js +++ b/index.js @@ -7,15 +7,14 @@ const SvgSpritemapPlugin = require('svg-spritemap-webpack-plugin') const path = require('path') const glob = require('glob') -const PATHS = { - src: path.join(__dirname, 'resources/js') -} - module.exports = function tinyComponentsWebpack(files, options = {}) { // merge options with defaults const defaults = Object.assign({ - destination: path.resolve(__dirname, 'public') + destination: path.resolve(__dirname, 'public'), + purge: { + src: path.join(__dirname, 'js') + } }, options) const config = { @@ -42,24 +41,13 @@ module.exports = function tinyComponentsWebpack(files, options = {}) { module: { rules: [{ - test: /\.riot$/, - exclude: /node_modules/, - use: [{ - loader: '@riotjs/webpack-loader', - options: { - hot: false, - } - }] - }, - { - test: /\.scss$/, - use: [ - MiniCssExtractPlugin.loader, - 'css-loader', - 'sass-loader' - ], - } - ] + test: /\.scss$/, + use: [ + MiniCssExtractPlugin.loader, + 'css-loader', + 'sass-loader' + ] + }] }, plugins: [ @@ -68,11 +56,19 @@ module.exports = function tinyComponentsWebpack(files, options = {}) { filename: 'css/[name].css', }), new PurgeCSSPlugin({ - paths: glob.sync(`${PATHS.src}/**/*`, { nodir: true }) + paths: glob.sync(`${defaults.purge.src}/**/*`, { nodir: true }) }), ], } + // if rules exists add + if (defaults.rules) { + defaults.rules.each((rule) => { + config.module.rules.push(rule) + }) + } + + // adding svg src if (defaults.svg.src) { config.plugins.push(new SvgSpritemapPlugin(defaults.svg.src, { output: { diff --git a/package.json b/package.json index 1d91ddd..ca1ae39 100644 --- a/package.json +++ b/package.json @@ -1,16 +1,14 @@ { "name": "@tiny-components/webpack", - "version": "0.1.0", + "version": "0.2.0", "description": "Webpack Wrapper", "repository": { "type": "git", "url": "git@gitea.node001.net:tiny-components/webpack.git" }, - "author": "Björn Hase", + "author": "Björn Hase ", "license": "MIT", "devDependencies": { - "@riotjs/compiler": "^9.0.7", - "@riotjs/webpack-loader": "^9.0.1", "css-loader": "^6.10.0", "mini-css-extract-plugin": "^2.8.1", "purgecss-webpack-plugin": "^5.0.0", diff --git a/rules/riot.js b/rules/riot.js new file mode 100644 index 0000000..0914cc3 --- /dev/null +++ b/rules/riot.js @@ -0,0 +1,15 @@ +/** + * npm install @riotjs/compiler @riotjs/webpack-loader --save-dev + * + */ + +module.exports = { + test: /\.riot$/, + exclude: /node_modules/, + use: [{ + loader: '@riotjs/webpack-loader', + options: { + hot: false, + } + }] +}