wip

Author: TheAlexLichter

.eslintrc.js

@@ -1,9 +1,5 @@
 module.exports = {
   root: true,
-  parserOptions: {
-    parser: 'babel-eslint',
-    sourceType: 'module'
-  },
   extends: [
     '@nuxtjs'
   ]

.github/workflows/ci.yml

@@ -0,0 +1,45 @@
+name: ci
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  ci:
+    runs-on: ${{ matrix.os }}
+
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        node: [10, 12]
+
+    steps:
+      - uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: cache node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: ${{ matrix.os }}-node-v${{ matrix.node }}-deps-${{ hashFiles(format('{0}{1}', github.workspace, '/yarn.lock')) }}
+
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn
+
+      - name: Lint
+        run: yarn lint
+
+      - name: Test
+        run: yarn test
+
+      - name: Coverage
+        uses: codecov/codecov-action@v1

.travis.yml

@@ -1 +1,5 @@
-module.exports = { extends: ['@commitlint/config-conventional'] }
+module.exports = {
+  extends: [
+    '@commitlint/config-conventional'
+  ]
+}

commitlint.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  hooks: {
+    'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
+    'pre-commit': 'yarn lint',
+    'pre-push': 'yarn lint'
+  }
+}

husky.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  collectCoverage: true,
+  collectCoverageFrom: ['lib/**/*.js'],
+  testEnvironment: 'node'
+}

jest.config.js

@@ -0,0 +1,3 @@
+const consola = require('consola')
+
+module.exports = consola.withScope('nuxt:purgecss')

lib/logger.js

@@ -1,22 +1,22 @@
 const path = require('path')
 const glob = require('glob-all')
 
-const logger = require('consola').withScope('nuxt-purgecss')
+const logger = require('./logger')
 
 const MODES = {
   webpack: 'webpack',
   postcss: 'postcss'
 }
 
-export default function nuxtPurgeCss(moduleOptions) {
+function nuxtPurgeCss (moduleOptions) {
   const { srcDir, purgeCSS = {} } = Object.assign({}, this.options)
 
   Object.assign(purgeCSS, moduleOptions)
 
   logger.start('Loading module')
 
   const defaults = {
-    mode: MODES.webpack,
+    mode: MODES.postcss,
     enabled: this.options.debug ? false : ({ isDev, isClient }) => (!isDev && isClient),
     paths: [
       'components/**/*.vue',
@@ -27,14 +27,17 @@ export default function nuxtPurgeCss(moduleOptions) {
     styleExtensions: ['.css'],
     whitelist: ['body', 'html', 'nuxt-progress', '__nuxt', '__layout'],
     whitelistPatterns: [
-      /.*-(enter|enter-active|enter-to|leave|leave-active|leave-to)/,
-      /data-v-.*/ // this is needed to prevent removing used scoped css classes
+      /-(leave|enter|appear)(|-(to|from|active))$/, // Normal transitions
+      /^nuxt-link(|-exact)-active$/, // Nuxt link classes
+      /^(?!cursor-move).+-move$/, // Move transitions
+      /data-v-.*/ // Keep scoped styles
     ],
     whitelistPatternsChildren: [],
     extractors: [
       {
-        extractor(content) {
-          return content.match(/[\w-.:/]+(?<!:)/g) || []
+        extractor: (content) => {
+          const contentWithoutStyleBlocks = content.replace(/<style[^]+?<\/style>/gi, '') // Remove inline vue styles
+          return contentWithoutStyleBlocks.match(/[\w-.:/]+(?<!:)/g) || []
         },
         extensions: ['html', 'vue', 'js']
       }
@@ -82,22 +85,22 @@ export default function nuxtPurgeCss(moduleOptions) {
 
   if (mode === MODES.webpack) {
     if (!this.options.build.extractCSS) {
-      logger.error(`Webpack mode only works with build.extractCSS set to *true*. Either extract your CSS or use 'postcss' mode`)
+      logger.error('Webpack mode only works with build.extractCSS set to *true*. Either extract your CSS or use \'postcss\' mode')
       return
     }
     this.extendBuild(webpackFn(enabled, config))
     return
   }
 
   if (Array.isArray(this.options.build.postcss)) {
-    logger.error(`build.postcss array option detected. Purgecss will only work in postcss mode with an option object`)
+    logger.error('build.postcss array option detected. Purgecss will only work in postcss mode with an option object')
     return
   }
 
   if (config.extractors) {
     config.extractors.forEach((e) => {
       if (e.extractor && e.extractor.extract) {
-        logger.warn(`extractors need to be defined as function now, transformed class definition to function`)
+        logger.warn('extractors need to be defined as function now, transformed class definition to function')
         e.extractor = e.extractor.extract
       }
     })
@@ -128,4 +131,5 @@ const webpackFn = (enabled, purgeCssConfig) => (config, ctx) => {
   logger.success('Module initialized in webpack mode')
 }
 
+module.exports = nuxtPurgeCss
 module.exports.meta = require('../package.json')

lib/module.js

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-purgecss",
-  "version": "0.2.1",
-  "description": "",
+  "version": "1.0.0",
+  "description": "Drop superfluous CSS! A neat PurgeCSS wrapper for Nuxt.js",
   "license": "MIT",
   "contributors": [
     {
@@ -21,15 +21,10 @@
   },
   "scripts": {
     "dev": "nuxt --config-file test/fixture/configs/postcss/default.js",
-    "lint": "eslint lib test",
-    "test": "yarn run lint && jest --detectOpenHandles",
-    "release": "standard-version && git push --follow-tags && npm publish",
-    "commitlint": "commitlint -E HUSKY_GIT_PARAMS",
-    "coverage": "codecov"
+    "lint": "eslint --ext .js,.vue .",
+    "release": "yarn test && standard-version && git push --follow-tags && npm publish",
+    "test": "yarn lint && jest"
   },
-  "eslintIgnore": [
-    "lib/templates/*.*"
-  ],
   "files": [
     "lib"
   ],
@@ -41,7 +36,7 @@
     "css"
   ],
   "engines": {
-    "node": ">=8.0.0",
+    "node": ">=10.0.0",
     "npm": ">=5.0.0"
   },
   "jest": {
@@ -61,25 +56,16 @@
     "purgecss-webpack-plugin": "^2.0.5"
   },
   "devDependencies": {
-    "@commitlint/cli": "^7.5.2",
-    "@commitlint/config-conventional": "^7.5.0",
-    "@nuxtjs/eslint-config": "^0.0.1",
-    "babel-eslint": "^10.0.1",
-    "codecov": "^3.3.0",
-    "eslint": "^5.16.0",
-    "eslint-config-standard": "^12.0.0",
-    "eslint-plugin-import": "^2.16.0",
-    "eslint-plugin-jest": "^22.4.1",
-    "eslint-plugin-node": "^8.0.1",
-    "eslint-plugin-promise": "^4.1.1",
-    "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^5.2.2",
-    "get-port": "^4.2.0",
+    "@commitlint/cli": "latest",
+    "@commitlint/config-conventional": "latest",
+    "@nuxtjs/eslint-config": "latest",
+    "@nuxtjs/module-test-utils": "latest",
+    "eslint": "latest",
     "husky": "^1.3.1",
     "jest": "^23.6.0",
     "jsdom": "^13.2.0",
-    "nuxt-edge": "^2.3.0-25706271.cca799c",
-    "standard-version": "^4.4.0"
+    "nuxt-edge": "latest",
+    "standard-version": "latest"
   },
   "husky": {
     "hooks": {

package.json

@@ -1,7 +1,17 @@
 <template>
-  <div class="ymca">
+  <div class="ymca" :class="{ bound: true }">
     Test
   </div>
 </template>
 
-<style src="./Test.css"/>
+<style src="./Test.css" />
+
+<style>
+.inline-unused {
+  color: blue;
+}
+
+.bound {
+  color: red;
+}
+</style>