Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Class extends value undefined is not a constructor or null #196

Open
Julien-Aubert-Housfy opened this issue Feb 23, 2022 · 4 comments
Open

Comments

@Julien-Aubert-Housfy
Copy link

Julien-Aubert-Housfy commented Feb 23, 2022

Getting the following error installing the plugin:

TypeError: Failed to load plugin 'vue-scoped-css' declared in '.eslintrc.js': Class extends value undefined is not a constructor or null

Here's my eslintrc.js file:

module.exports = {
    env: {
        browser: true,
        es2021: true,
        node: true,
    },
    extends: [
        'plugin:vue/essential',
        'eslint:recommended',
        'plugin:vue-scoped-css/recommended',
    ],
    parserOptions: {
        parser: '@typescript-eslint/parser',
        ecmaVersion: 'latest',
        sourceType: 'module',
    },
    plugins: ['vue', '@typescript-eslint'],
    rules: {
        'import/order': 'off',
        'vue/no-v-html': 'off',
        'vue/no-unused-components': 'off',
        'no-unused-vars': 1,
        'no-undef': 2,
        'prefer-const': 2,
        'no-console': 0,
        'standard/computed-property-even-spacing': 'off',
        'object-shorthand': 'off',
        'vue-scoped-css/enforce-style-type': 'warn',
    },
}

I tried installing the plugin in a couple projects of mine and I still get the same error. Any idea what could be causing this?

@ota-meshi
Copy link
Member

Thank you for posting this issue.
I can't reproduce your problem. Can you share a minimal repository that can reproduce your problem?

@ota-meshi ota-meshi added the needs repro Need a repository that can reproduce the problem label Feb 23, 2022
@Julien-Aubert-Housfy
Copy link
Author

Julien-Aubert-Housfy commented Feb 23, 2022

Thanks for the quick reply. Here's a repo where you'll be able to reproduce the issue:
https://github.com/Julien-Aubert-Housfy/issue-plugin

@ota-meshi
Copy link
Member

Thank you for for sharing the repository.

It seems that you need to install the latest version of postcss yourself.
This requires postcss-scss to postcss@^8, but the dependency you use seems to use postcss@7.0.39.

eslint-plugin-vue-scoped-css defines postcss@^8.2.4 as a dependency, but it seems that it can not be solved well because it is placed in the node_modules directory of the lower layer. I think this is strictly a postcss-scss dependency issue.

@ota-meshi ota-meshi added upstream issue and removed needs repro Need a repository that can reproduce the problem labels Feb 24, 2022
@Julien-Aubert-Housfy
Copy link
Author

Plugin is working as it should after installing the latest version of postcss and postcss-scss.
Thank you very much for your help!

# for free to join this conversation on GitHub. Already have an account? # to comment
Projects
None yet
Development

No branches or pull requests

2 participants