I don't find where to enable introspectComments or classValidatorShim. It is required for some extra features of swagger plugin as it is stated in the docs:
If anybody knows it would be great
It was further down in the documentation, in any case,i hope this post can save some time to someone.
In nest-cli.json
"plugins": [
{
"name": "#nestjs/swagger",
"options": {
"classValidatorShim": false,
"introspectComments": true
}
}
]
Bests
Related
I'm struggeling now for a couple of days to get my testsetup running. Rough outline: Vite, Svelte (with ts), Jest.
I'm using import.meta.env.SOMENAME for my environment vars although this works fine for development as soon as a component uses import.meta.env the test will fail with:
SyntaxError: Cannot use 'import.meta' outside a module
I've tried different transformers, babel-plugins and configs but never succeeded...
My jest config:
"jest": {
"globals": {
"ts-jest": {
"isolatedModules": true
}
},
"verbose": true,
"transform": {
"^.+\\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
],
"^.+\\.ts$": "ts-jest",
"^.+\\.js$": "babel-jest"
},
"setupFilesAfterEnv": ["<rootDir>/setupTests.ts"],
"moduleFileExtensions": ["js", "ts", "svelte"]
}
babel.config.js
module.exports = {
presets: [
[
"#babel/preset-env",
{
targets: {
node: "current"
}
}
]
]
};
svelte.config.cjs
const sveltePreprocess = require('svelte-preprocess')
module.exports = {
emitCss: true,
preprocess: sveltePreprocess()
};
Among other things I tried to use #babel/plugin-syntax-import-meta but ended up with the same error. Also vite-jest looked very promising but again I couldn't make it work.
I appreciate every hint I can get. If I can provide any additional info please let me know. Also my knowledge of vite and babel is very limited so REALLY appreciate any help IU can get on this topic.
Update (Solution)
So If you use babel you could use babel-preset-vite. The approach with esbuild-jest from Apu is also good solution that many people use. Unfortunately those things didn't work for me so I decided to use a workaround with vite's define.
This workaround consists of two steps.
replace import.meta.env with process.env (if this is a deal breaker for you then I hope you have luck with the solutions above) You only have to replace the instances in files you want to test with jest.
Update Vite config with define. This step is necessary or your build will break (dev will still work)
vite.config.js
const dotEnvConfig = dotenv.config();
export default defineConfig({
define: {
"process.env.NODE_ENV": `"${process.env.NODE_ENV}"`,
"process.env.VITE_APP_SOMENAME": `"${process.env.VITE_APP_SOMENAME}"`
},
...
)};
I know this is just a workaround but maybe this helps someone. Thanks & Good Luck.
A more recent alternative to Jest that understands import.meta.env is Vitest.
It should require almost no additional configuration to get started and it's highly compatible with Jest so it requires few changes to the actual tests.
The advantages of Vitest over Jest for this use case are:
It's designed specifically for Vite and will process tests on demand
It will reuse your existing Vite configuration:
Any define variables will be replaced as expected
Extensions that Vite adds to import.meta will be available as usual
I was having issues with svelte component testing as well using jest. babel is not good at resolving import.meta. I used esbuild-jest to transform both ts and js files. It solves the issue with the import.meta. Here is my jest.config.cjs.
npm i esbuild esbuild-jest -D
const { pathsToModuleNameMapper } = require('ts-jest/utils');
const { compilerOptions } = require('./tsconfig');
const config = {
"transform": {
"^.+\\.svelte$": [
"svelte-jester",
{
"preprocess": true
}
],
"^.+\\.(ts|tsx|js|jsx)$": ["esbuild-jest"]
},
"moduleFileExtensions": [
"js",
"ts",
"tsx",
"svelte"
],
"setupFilesAfterEnv": [
"#testing-library/jest-dom/extend-expect"
],
"collectCoverageFrom": [
"**/*.(t|j)s",
"**/*.svelte"
],
coverageProvider: 'v8',
"coverageDirectory": "./coverage",
"coveragePathIgnorePatterns": [
"/node_modules/",
"/.svelte-kit/"
],
"moduleNameMapper": pathsToModuleNameMapper(compilerOptions.paths, {prefix: '<rootDir>/'})
};
module.exports = config;
I am using the following npm package named arkit in order to create architecture diagrams of node.js projects, but I am unable to visualize npm packages (dependencies folder) in my node.js application architecture as depicted in the examples of Arkit and Vue/Nuxt TodoMVC, I tried to follow the json configuration of each of their respective arkits but either they are non-existent like in Vue or vague like in Arkit itself.
I used the config given in arkit configuration example but I end up with all dependencies of main dependencies like this. I tried the following config
{ "$schema": "https://arkit.pro/schema.json",
"excludePatterns": ["test/**", "tests/**", "**/*.test.*", "**/*.spec.*"],
"components": [
{ "type": "Dependency",
"patterns": ["node_modules/**/*.js"] },
{ "type": "Component",
"patterns": ["**/*.js", "**/*.jsx"]
}
],
"output": [
{ "path": "arkit.svg",
"groups": [ { "first": true, "components": ["Component"] },
{
"type": "Dependencies",
"components": ["Dependency"]
}
]
}
]
}
but it crashed during architecture generation, I also emailed the owner of this npm package and one other person who successfully managed to do so, but they are busy to guide me in configuring JSON of arkit.
Can I use the for-of loop in the JSON config file in order to get only those node_modules which are included in package.json as I don't want to get additional sub-dependencies of the main npm packages in the architecture representation as depicted in the link shared above!
TL;DR
I want diagrams with dependencies like these but I am getting this
I tried, adding --depth=0 in the command line "npx arkit --config test.json --depth=0" but no luck
I think arkit expects output.path to be an array - but you are passing it a string. Try using the modified config:
{
"$schema": "https://arkit.pro/schema.json",
"excludePatterns": ["test/**", "tests/**", "**/*.test.*", "**/*.spec.*"],
"components": [{
"type": "Dependency",
"patterns": ["node_modules/*"]
},
{
"type": "Component",
"patterns": ["**/*.js", "**/*.jsx"]
}
],
"output": [{
"path": ["arkit.svg"],
"groups": [{
"first": true,
"components": ["Component"]
},
{
"type": "Dependencies",
"components": ["Dependency"]
}
]
}]
}
It's working on Ubuntu as if there are more reasons to hate Windows 10. I implemented the package.json config of the authors Vue application and viola it worked like a charm. 2 months of looking for answers and trying everything on Windows, Ubuntu did the trick
I want to include the rule no-unpublished-import from eslint-plugin-node, however, it is conflicting with my current .eslintrc because I am using typescript-eslint and eslint-import-resolver-typescript.
It is my current configuration:
{
"parser": "#typescript-eslint/parser", // Specifies the ESLint parser
"extends": [
"airbnb-base",
"plugin:#typescript-eslint/recommended", // Uses the recommended rules from the #typescript-eslint/eslint-plugin
"prettier", // Enables eslint-plugin-prettier and displays prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array
"prettier/#typescript-eslint" // Uses eslint-config-prettier to disable ESLint rules from #typescript-eslint/eslint-plugin that would conflict with prettier
],
"parserOptions": {
"project": "./tsconfig.json",
"ecmaVersion": 6, // Allows for the parsing of modern ECMAScript features
"sourceType": "module" // Allows for the use of imports
},
"rules": {
},
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".ts"]
},
// use <root>/tsconfig.json
"typescript": {
"alwaysTryTypes": true // always try to resolve types under `<root>#types` directory even it doesn't contain any source code, like `#types/unist`
}
}
},
"root": true
}
The code compiles correctly, however, if I add to the extends option the plugin:node/recommended the compilation process will fail:
1:1 error Import and export declarations are not supported yet node/no-unsupported-features/es-syntax
1:43 error "express" is not found node/no-missing-import
2:1 error Import and export declarations are not supported yet node/no-unsupported-features/es-syntax
My package.json includes the node": ">=12.0.0. Also, this rule should be ignored because I am using typescript. On the other hand, I am just exporting types from express because the module don't use it.
According to this issue the conflict should be resolved by eslint-plugin-node.
How can I accomplish the merge of both plugins? Do I have to go disabling rules one by one?
UPDATED:
It seems it was asked in this issue on the eslint-plugin-node repository. It works for no-unsupported-features and no-missing-import, however, it is still failing with the import definition of express with no-extraneous-import.
UPDATED 2:
It seems eslint-plugin-node is working on a enhancement to accomplish it. Issue here
Firstly, you have to add the option tryExtension to include TS files:
"settings": {
"node": {
"tryExtensions": [".js", ".json", ".node", ".ts", ".d.ts"]
},
To solve the no-unsupported-features/es-syntax, according to this issue about adding information to works with TypeScript, if you work with transpilers you will have to ignore it under rules:
"node/no-unsupported-features/es-syntax": ["error", { "ignores": ["modules"] }],
On the other hand, use just types and not the code is not supported yet by the eslint-plugin-node. They are working on a enhancement to solve it. However,, to solve the no-missing-import, you have to add to the resolvePath the node_modules/#types:
"node": {
"resolvePaths": ["node_modules/#types"],
"tryExtensions": [".js", ".json", ".node", ".ts", ".d.ts"]
},
Even so, it will generate a no-extraneous-import because it doesn't detect the module, because it is just a type. Meanwhile they are working on this enhancement, you can use allowModules under that rule for workaround:
"node/no-extraneous-import": ["error", {
"allowModules": ["express"]
}]
Can someone please let me know from where I can change this configuration so that it should refer from the CDN path instead of localhost
Below is my package-solution.json
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
"solution": {
"name": "mega-menu-sp-fx-client-side-solution",
"id": "8f49d75c-5a49-4657-b81b-0290f239350f",
"version": "10.0.0.0",
"includeClientSideAssets": true,
"skipFeatureDeployment": true,
"isDomainIsolated": false,
"features": [
{
"title": "Application Extension - Deployment of custom action.",
"description": "Deploys a custom action with ClientSideComponentId association",
"id": "0d2345df-2a49-4ce9-ba2d-bee7ad3e7a02",
"version": "10.0.0.0",
"assets": {
"elementManifests": [
"elements.xml",
"clientsideinstance.xml"
]
}
}
]
},
"paths": {
"zippedPackage": "solution/mega-menu-sp-fx.sppkg"
}
}
Below is my write-manifest.json
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
"cdnBasePath": "https://Mytenant.sharepoint.com/sites/MyTechTheme/MenuFiles"
}
I tried to figure out whats the issue. For publishing instead of gulp package-solution --ship I had used gulp package-solution so unless and until we don't mention --ship it wont take the references for CDN
So for deploying the package in SPO we need to use gulp bundle --ship and gulp package-solution --ship
As per this thread, to load SPFx assets from a CDN or SharePoint library, set the value of "includeClientSideAssets" to false.
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
"solution": {
...
"includeClientSideAssets": false,
...
}
}
$npm install -g #angular/cli
$ng new angular --routing --style=sass
$ng g c home
"apps": [
{
"styles": [
"styles.sass"
],
}
"defaults": {
"styleExt": "sass",
"component": {
}
}
I want to sass style in angular, I use angular cli, I try to generate component it returns with style with prefix css. May you help me to fixing that? Thanks in advance for your answer.
To override the default style, you can use the option --style [css|scss|sass]:
ng g c home --style=css
I just migrated from #angular/cli#1.0.3 to #angular/cli#1.4.2 and I am facing the same issue. Turns out it's due to a bug introduced in v1.4.1 so we can only wait for a new angular-cli release that will fix this bug.
In v1.4.1 also the apps.prefix is ignored but this was fixed in v1.4.2.
In the mean time, the workaround provided by #Derlin can be used.
github issues on this topic:
https://github.com/angular/angular-cli/issues/7624
https://github.com/angular/angular-cli/issues/7682
https://github.com/angular/angular-cli/issues/7644
https://github.com/angular/angular-cli/issues/7647
https://github.com/angular/angular-cli/issues/7522
update:
The issue is fixed in #angular/cli#1.4.3. Check this release note.
#angular/cli: Generating component considers default style extension
for project now
Here is my defaults that works :
"defaults": {
"styleExt": "scss",
"prefixInterfaces": false,
"inline": {
"style": false,
"template": false
},
"spec": {
"class": false,
"component": true,
"directive": true,
"module": false,
"pipe": true,
"service": true
}
}
Otherwise, you can just rename it.