Postcss incompatibility between Nuxt and kolibri-tools

[bjester]

Product

KDS, Kolibri Tools

Desired behavior

We should ideally have kolibri-tools (or kolibri-linting-*) to resolve dependencies relative to its own package, so that we can avoid the cross-dependency conflicts and issues

Current behavior

With the version of Vue we currently support, we're constrained to Nuxt v2.15, until we make the switch to Vue 2.7. Some other Nuxt dependencies in this version use postcss v7, which isn't directly compatible with kolibri-tools version, v8. This requires us to pin the resolution to v8 in order to workaround some linting issues that arise:

Kolibri Linter: TypeError: Class extends value undefined is not a constructor or null
TypeError: Class extends value undefined is not a constructor or null
    at Object.<anonymous> (/home/bjester/Projects/learningequality/kolibri-design-system/node_modules/postcss-scss/lib/nested-declaration.js:3:33)
    at Module._compile (node:internal/modules/cjs/loader:1364:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
    at Module.load (node:internal/modules/cjs/loader:1203:32)
    at Module._load (node:internal/modules/cjs/loader:1019:12)
    at Module.require (node:internal/modules/cjs/loader:1231:19)
    at require (node:internal/modules/helpers:177:18)
    at Object.<anonymous> (/home/bjester/Projects/learningequality/kolibri-design-system/node_modules/postcss-scss/lib/scss-parser.js:4:25)
    at Module._compile (node:internal/modules/cjs/loader:1364:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)

The main consequence of this is that the documentation generation throws warnings when using v8, although does build everything correctly:

 WARN  postcss-*: postcss.plugin was deprecated. Migration guide:                                                                                                                            09:13:58
https://evilmartians.com/chronicles/postcss-8-plugin-migration