У меня есть глобальное расширение, которое определяет метод с именем «is». У меня проблема в том, что ESLink помечает его как "no-undef"; несмотря на то, что оно доступно во время выполнения.
Отключение правила для меня не вариант. Я бы лучше определил его так, чтобы ESLint мог его видеть.
Мой проект использует NodeJS, Vue, TypeScript, Babel и WebPack. Не то чтобы это имело значение, но версия машинописного текста JavaScript установлена на esnext .
Ниже приведены мои цели, о которых я прошу вас иметь в виду :
- Нет никаких других ошибок компиляции или времени выполнения, кроме этой ошибки ESLint
- Если я объявляю свой метод в верхней части каждого файла, использующего его, все отлично работает
- Я ожидаю, что существует централизованный, простой способ определения его для ESLint
- Я не использую файл определения типа (AKA d.ts), потому что вы не можете определить его таким образом
// This is my 'is.ts' file; THIS IS NOT THE SAME AS A d.ts FILE
...
function is() { ... }
declare global {
function is(): boolean { ... }
}
// physically define on window giving my method global scope
const _LocalWindow: any = window;
_LocalWindow.is = _LocalWindow.is || is;
В другом месте моего приложения
declare function is(): boolean; // <== ONLY WAY TO PREVENT ESLINT ERROR 'no-undef'
if (is()) { // <== I DON'T WANT TO USE 'window.is'
...
}
Для справки ниже приведены мои пакеты. json и jsconfig. json конфигурация файлы
// package.json
{
"name": "vuedatagriddemo",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.19.2",
"core-js": "^3.6.4",
"vue": "^2.6.11",
"vue-class-component": "^7.2.2",
"vue-property-decorator": "^8.3.0",
"vue-router": "^3.1.5",
"vuetify": "^2.2.17",
"vuex": "^3.1.2"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^2.18.0",
"@typescript-eslint/parser": "^2.18.0",
"@vue/cli-plugin-babel": "~4.2.0",
"@vue/cli-plugin-eslint": "~4.2.0",
"@vue/cli-plugin-router": "~4.2.0",
"@vue/cli-plugin-typescript": "~4.2.0",
"@vue/cli-plugin-vuex": "~4.2.0",
"@vue/cli-service": "~4.2.0",
"@vue/eslint-config-airbnb": "^5.0.2",
"@vue/eslint-config-typescript": "^5.0.1",
"eslint": "^6.7.2",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-vue": "^6.1.2",
"sass": "^1.25.0",
"sass-loader": "^8.0.2",
"typescript": "~3.7.5",
"vue-template-compiler": "^2.6.11"
}
}
// tsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"types": [
"webpack-env"
],
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}