Vue 2 template using Vue 3 ESLint rules?

[m-thomson]

🐛 bug report

Preflight Checklist

• [x ] I have read the
  Contributing Guidelines
  for this project.
• [ x] I agree to follow the
  Code of Conduct
  that this project adheres to.
• [x ] I have searched the issue tracker for an issue that matches the one I want
  to file, without success.

Description of the problem

• I've created a Vue 2 project using the default Vue CodeSandbox template: https://codesandbox.io/s/vue-vue
• I'm seeing ESLint warnings that should only apply to Vue 3.
• For example, this Vue 3 rule is being triggered: https://eslint.vuejs.org/rules/no-deprecated-v-bind-sync.html on line 15 in the file App.vue in the sandbox I've provided. I've also attached a screenshot below.
• Also see line 23 of file components/FormItem.vue which triggers this Vue 3 only rule: https://eslint.vuejs.org/rules/require-slots-as-functions.html

How has this issue affected you? What are you trying to accomplish?

I don't want to disable ESLint.

To Reproduce

See the lines mentioned above in https://codesandbox.io/s/vue-2-eslint-problem-o19ht

Link to sandbox:

https://codesandbox.io/s/vue-2-eslint-problem-o19ht

Your Environment

Software	Name/Version
Сodesandbox
Browser	Brave(Version 1.14.84 Chromium: 85.0.4183.121)
Operating System	MacOS

Screenshot

Note from screenshot - Using Vue 2.6

[m-thomson]

Since CodeSandbox is using Vetur, I wonder if this is relevant vuejs/vetur#2015

[lbogdan]

Hey @m-thomson ,

Thank you for your report!

This happens because we're using semver.gte() to figure out if the sandbox is using Vue 2 or 3:

codesandbox-client/packages/app/src/app/overmind/effects/vscode/LinterWorker/index.js

Lines 6 to 13 in 3df865b

	function isMinimalSemverVersion(version: string, minimalVersion: string) {
	try {
	return semver.gte(version, minimalVersion);
	} catch (e) {
	// Semver couldn't be parsed, we assume that we're on the bleeding edge now, so true.
	return true;
	}
	}

codesandbox-client/packages/app/src/app/overmind/effects/vscode/LinterWorker/index.js

Lines 462 to 465 in 3df865b

	config = await getVueConfig(
	linter,
	!isMinimalSemverVersion(dependencies.vue || '2.0.0', '3.0.0')
	);

but it seems that semver doesn't support caret versions like ^2.6.11 and throws with "TypeError: Invalid Version: ^2.6.11".

We're figuring out how to improve the check and will get back to you shortly!

[lbogdan]

@m-thomson You can test the fix in #4999 here: https://pr4999.build.csb.dev/s/o19ht .

[lbogdan]

@m-thomson The fix was just deployed, please test and confirm that it's working as expected.

And thanks again for the detailed report!

[m-thomson]

This seems to be fixed. Thanks for getting to it so quickly.