feat: add purgecss in production

This commit is contained in:
Valentin Kaelin 2019-10-22 17:44:02 +02:00
parent d698057fae
commit 398e18d10c
3 changed files with 55 additions and 66 deletions

View file

@ -818,13 +818,13 @@
}
},
"@fullhuman/postcss-purgecss": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-1.2.0.tgz",
"integrity": "sha512-An05jbnZVUrX+VVNniaNQtOuo/S7tyQu5x86itXTF+7kfMaGxglFGykFX2KCt2hcbJijbvfCval9IkPO19V1KA==",
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/@fullhuman/postcss-purgecss/-/postcss-purgecss-1.3.0.tgz",
"integrity": "sha512-zvfS3dPKD2FAtMcXapMJXGbDgEp9E++mLR6lTgSruv6y37uvV5xJ1crVktuC1gvnmMwsa7Zh1m05FeEiz4VnIQ==",
"dev": true,
"requires": {
"postcss": "^7.0.14",
"purgecss": "^1.3.0"
"purgecss": "^1.4.0"
}
},
"@hapi/address": {
@ -8428,18 +8428,6 @@
}
}
},
"postcss-import": {
"version": "12.0.1",
"resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-12.0.1.tgz",
"integrity": "sha512-3Gti33dmCjyKBgimqGxL3vcV8w9+bsHwO5UrBawp796+jdardbcFl4RP5w/76BwNL7aGzpKstIfF9I+kdE8pTw==",
"dev": true,
"requires": {
"postcss": "^7.0.1",
"postcss-value-parser": "^3.2.3",
"read-cache": "^1.0.0",
"resolve": "^1.1.7"
}
},
"postcss-js": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-2.0.1.tgz",
@ -9049,15 +9037,46 @@
"dev": true
},
"purgecss": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/purgecss/-/purgecss-1.3.0.tgz",
"integrity": "sha512-0UMnr8aUsPO7RbzAT72UELRvwMHhadtuunDm7rcgRS6b8pCVO8yglIqikiYFwQk2XP606mk+GpjI1G74Auxgtg==",
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/purgecss/-/purgecss-1.4.0.tgz",
"integrity": "sha512-or7/16i7O6DH+NpXqY8NCcWCc940O6PxOgjWAcMTElzgccKOJua1/n6JVtM8UYqoMMWoCyKk+CbLpo4+4mY3BQ==",
"dev": true,
"requires": {
"glob": "^7.1.3",
"postcss": "^7.0.14",
"postcss-selector-parser": "^6.0.0",
"yargs": "^13.2.2"
"yargs": "^14.0.0"
},
"dependencies": {
"yargs": {
"version": "14.2.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-14.2.0.tgz",
"integrity": "sha512-/is78VKbKs70bVZH7w4YaZea6xcJWOAwkhbR0CFuZBmYtfTYF0xjGJF43AYd8g2Uii1yJwmS5GR2vBmrc32sbg==",
"dev": true,
"requires": {
"cliui": "^5.0.0",
"decamelize": "^1.2.0",
"find-up": "^3.0.0",
"get-caller-file": "^2.0.1",
"require-directory": "^2.1.1",
"require-main-filename": "^2.0.0",
"set-blocking": "^2.0.0",
"string-width": "^3.0.0",
"which-module": "^2.0.0",
"y18n": "^4.0.0",
"yargs-parser": "^15.0.0"
}
},
"yargs-parser": {
"version": "15.0.0",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-15.0.0.tgz",
"integrity": "sha512-xLTUnCMc4JhxrPEPUYD5IBR1mWCK/aT6+RJ/K29JY2y1vD+FhtgKK0AXRWvI262q3QSffAQuTouFIKUuHX89wQ==",
"dev": true,
"requires": {
"camelcase": "^5.0.0",
"decamelize": "^1.2.0"
}
}
}
},
"q": {
@ -9138,23 +9157,6 @@
"unpipe": "1.0.0"
}
},
"read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
"integrity": "sha1-5mTvMRYRZsl1HNvo28+GtftY93Q=",
"dev": true,
"requires": {
"pify": "^2.3.0"
},
"dependencies": {
"pify": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
"dev": true
}
}
},
"read-pkg": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.1.1.tgz",

View file

@ -15,15 +15,13 @@
"vuex": "^3.1.1"
},
"devDependencies": {
"@fullhuman/postcss-purgecss": "^1.2.0",
"@fullhuman/postcss-purgecss": "^1.3.0",
"@vue/cli-plugin-babel": "^3.8.0",
"@vue/cli-plugin-eslint": "^3.8.0",
"@vue/cli-service": "^3.8.4",
"babel-eslint": "^10.0.2",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"postcss-import": "^12.0.1",
"purgecss": "^1.3.0",
"tailwindcss": "^1.0.4",
"vue-template-compiler": "^2.5.21"
}

View file

@ -1,32 +1,21 @@
const tailwindcss = require("tailwindcss");
const autoprefixer = require("autoprefixer");
const purgecss = require("@fullhuman/postcss-purgecss");
const postcssImport = require('postcss-import')
const purgecss = require('@fullhuman/postcss-purgecss')({
class TailwindExtractor {
static extract(content) {
return content.match(/[A-Za-z0-9-_:\/]+/g) || [];
}
}
// Specify the paths to all of the template files in your project
content: [
'./src/**/*.vue',
'./public/**/*.html',
],
// Include any special characters you're using in this regular expression
defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || []
})
module.exports = {
plugins: [
postcssImport,
tailwindcss('./tailwind.config.js'),
// --- !!! purgecss not working !!! ---
// purgecss({
// content: ['./src/**/*.vue'],
// whitelist: ['html', 'body'],
// extractors: [
// {
// extractor: TailwindExtractor,
// extensions: ['html', 'js', 'vue']
// }
// ]
// }),
autoprefixer
require('tailwindcss'),
require('autoprefixer'),
...process.env.NODE_ENV === 'production'
? [purgecss]
: []
]
}