error:
ERROR in node_modules/ng2-opd-popup/node_modules/rxjs/Subject.d.ts(16,22): error TS2415: Class 'Subject' incorrectly extends base class 'Observable'. Types of property 'lift' are incompatible.
Type '(operator: Operator) => Observable' is not assignable to type '(operator: Operator) => Observable'.
Type 'Observable' is not assignable to type 'Observable'.
Type 'T' is not assignable to type 'R'.
tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
],
"paths": {
"#angular/": [
"../node_modules/#angular/"
]
}
}
i have tried this solution
"paths": {
"#angular/": [
"../node_modules/#angular/"
]
}
but it doesn't work for me
As posted here: https://github.com/opdahlmann/ng2-opd-popup-sample/issues/23
Try removing the folder:
$ rm -fr node_modules/ng2-opd-popup/node_modules
got it working after.
Related
I'm trying to configure jest/babel to do react component testing in my app. So far I'm facing some difficulties, in imports.
It throws this error:
Here is my babel.config.json:
{
"plugins": [
"#babel/plugin-proposal-class-properties",
"#babel/plugin-transform-runtime"
],
"presets": [
[
"#babel/preset-env",
{
"targets": {
"node": "current"
}
}
],
"#babel/preset-react"
]
}
I've trying adding "type": "module" in the package.json and it brings different problems upon itself. I would appreciate any help!
This is a question similar to Why eslint consider class as variable in naming-convention rule?, but that one is pretty old and I see no consistency in the handling now.
When I statically import a class type then ESLint recognizes it as such and applies the class naming rule, for example:
import { PieGraphLayout } from import("../console.worker-types");
When I do this with a dynamic import, however, I get an error:
const { PieGraphLayout } = await import("../console.worker-types");
leads to:
Variable name PieGraphLayout must match one of the following formats: camelCase eslint#typescript-eslint/naming-convention
I have to suppress this warning, but would like to modify my ESLint rules instead, if possible. My current naming-convention rule is:
"#typescript-eslint/naming-convention": [
"error",
{
"selector": "default",
"format": [
"camelCase"
],
"filter": {
"regex": "^_",
"match": false
}
},
{
"selector": "class",
"format": [
"PascalCase"
]
},
{
"selector": "typeParameter",
"format": [
"PascalCase"
]
},
{
"selector": "enum",
"format": [
"PascalCase"
]
},
{
"selector": "enumMember",
"format": [
"PascalCase"
]
},
{
"selector": "typeAlias",
"format": [
"PascalCase"
]
},
{
"selector": "interface",
"format": [
"PascalCase"
],
"prefix": [
"I"
]
}
],
What needs to be changed so that ESLint no longer gives a warning for such dynamic imports?
You don't have defined formats for variable entities, and ESLint uses your default selector format, which is camelCase in the provided configuration.
To provide formats for a variable, please configure variable selector.
In your case, there should be something like
{
"selector": "variable",
"format": [
"PascalCase"
]
},
Here is a doc for all available selectors.
My React Native project already has alias of some folder. They are put in babel.config.js file:
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
'plugins': [
[
'module-resolver',
{
'root': [
'.',
],
'alias': {
'assets/*': './src/assets/*',
'images': './src/assets/images',
'navigation': './src/navigation',
'navigation/*': './src/navigation/*',
'screens': './src/screens',
'screens/*': './src/screens/*',
'splash': './src/modules/splash',
'utils': './src/utils',
'utils/*': './src/utils/*',
'translations': './src/utils/translations',
'translations/*': './src/utils/translations/*',
'msg': './src/utils/translations/msg',
'languages': './languages',
'styles': './src/styles',
'styles/*': './src/styles/*',
'components': './src/components',
'constant': './src/constant',
'context': './src/context',
'api': './src/API',
'store': './src/store',
'store/*': './src/store/*',
},
},
],
'react-native-reanimated/plugin',
],
'env': {
'production': {
'plugins': [
'transform-remove-console',
],
},
},
};
But when I import a function using these alias, the intellisense does not work. I also try to create jsonconfig.json follow this document (https://code.visualstudio.com/docs/languages/jsconfig)
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"app/*": ["src/app/*"],
"assets/*": ["src/assets/*"],
"images": ["/src/assets/images"],
"navigation": ["/src/navigation"],
"navigation/*": ["/src/navigation/*"],
"screens": ["/src/screens"],
"screens/*": ["/src/screens/*"],
"splash": ["/src/modules/splash"],
"utils": ["/src/utils"],
"utils/*": ["/src/utils/*"],
"translations": ["/src/utils/translations"],
"translations/*": ["/src/utils/translations/*"],
"msg": ["/src/utils/translations/msg"],
"languages": ["/languages"],
"styles": ["/src/styles"],
"styles/*": ["/src/styles/*"],
"components": ["/src/components"],
"constant": ["/src/constant"],
"context": ["/src/context"],
"api": ["/src/API"],
"store": ["/src/store"],
"store/*": ["/src/store/*"],
}
}
}
but still not working. Anyone can help me to fix the intellisense in VS Code?
This is my first time with eslint so if I have missed any info below please do let me know with the comments. I have a react native project and have configured eslint in it. Here are my rules:
{
"env": {
"browser": true,
"es6": true,
"node": true,
"react-native/react-native": true,
},
"extends": "eslint:recommended",
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 2018,
"sourceType": "module"
},
"plugins": [
"react",
"react-native"
],
"rules": {
"quotes": [2, "double", "avoid-escape"],
"semi": [
"error",
"always"
],
"indent": [
"error",
2
],
"linebreak-style": [
"error",
"unix"
],
"react-native/no-unused-styles": 2,
"react-native/split-platform-components": 2,
"react-native/no-inline-styles": 2,
"react-native/no-color-literals": 2,
"react-native/no-raw-text": 2,
"object-curly-spacing": [2, "always", {
"objectsInObjects": true,
"arraysInObjects": true
}]
}
}
As you can see two important rules here about quotes and object-curly-spacing. Even though I have set quotes to double but still when I do yarn lint --fix it gives me warning that
warning Strings must use singlequote
and with the --fix flag it changes to single quotes. What I am doing wrong here please explain.
Similarly with object-curly-spacing set to "always" my imports are changed from having spaces in objects to no space i.e from { test } to {test}.
I want strings in double quotes and spaces after and before object literals.
I'd like to prevent src/config.js to be bundled in scripts/app-bundle.js
I saw that previously the syntax was:
"bundles": {
"dist/app-build": {
"includes": [
"[**/*.js]",
"**/*.html!text",
"**/*.css!text",
"cloneya",
"dexie",
"jquery",
"jquery-ui",
"medium-editor-webpack",
"moment",
"polymer/mutationobservers",
"safe-json-stringify"
],
excludes: [
"config.js" // So our wildcard globbing doesn't include this config file
],
...
However the new syntax is different: aurelia.json:
"bundles": [
{
"name": "app-bundle.js",
"source": [
"[**/*.js]",
"**/*.{css,html}"
],
"excludes" : [
"**/config.js"
]
},
My temptative 'exclude' statement doesn't do the trick
Solution is actually given on the GitHub page: https://github.com/aurelia/cli
Optionally, you can define an exclude list by setting the source
property to be an object containing both an include and exclude array
of patterns. This is helpful when you're trying to define multiple
bundles from your source code.
{
"name": "app-bundle.js",
"source": {
"include": [
"[**/*.js]",
"**/*.{css,html}"
],
"exclude": [
"**/sub-module/**/*",
]
}
},
{
"name": "sub-module-bundle.js",
"source": [
"**/sub-module/**/*",
]
}
Make sure you have version > 0.19.0