vscode document
The document told me that:
The concept of a workspace enables VS Code to:
Configure settings that only apply to a specific folder or folders but not others.
but I can not find the config method in the document.
I'm trying to configure settings that only apply to a specific folder but not others.
I've tried the configuration below, but no one validated it, does anybody know how to config that?
{
"folders": [
{
"path": "smart_claim"
},
{
"path": "claim-libaries",
"settings": {
"typescript.validate.enable": false,
"javascript.validate.enable": false
}
},
{
"path": "health-claim"
},
{
"path": "pet-claim"
},
{
"path": "xhb-claim"
}
],
"settings": {
"typescript.validate.enable": true,
"javascript.validate.enable": true
}
}
{
"folders": [
{
"path": "smart_claim"
},
{
"path": "claim-libaries",
"typescript.validate.enable": false,
"javascript.validate.enable": false
},
{
"path": "health-claim"
},
{
"path": "pet-claim"
},
{
"path": "xhb-claim"
}
],
"settings": {
"typescript.validate.enable": true,
"javascript.validate.enable": true
}
}
Related
Going through a project that start to be quite huge, we've got a workspace with 10+ folders.
Into those 10+ folders we have 9 folders that have the same code base in Node.js & the 10th one that is a private NPM package that we build and that all 9 others rely on.
We're trying to make things easier for all the devs to find some other usage of a function they want to explore and for that, we wanted to be able to find some function references / implementations across all the folders of the workspace.
For instance, if I go in one of the folder, in one of the source file :
and I right-click on the authorize method that is custom and implemented into the NPM private package. If I look up for References I'll get results like this :
But those are only the result of the reference of this method into this folder and not into others project that also use this express middleware.
You can see that I also get the result of the dist folder of the NPM package which seems logical but also seems to be the problem that I am facing.
I don't really know what can also be useful so feel free to ask me any kind of content and find attached the workspace configuration :
{
"folders": [
{
"name": "Docs",
"path": "./repositories/Docs"
},
{
"name": "Frontend",
"path": "./repositories/project_pwa"
},
{
"name": "Service A",
"path": "./repositories/project_A"
},
{
"name": "Service B",
"path": "./repositories/project_B"
},
{
"name": "Project C",
"path": "./repositories/project_C"
},
{
"name": "Project D",
"path": "./repositories/project_D"
},
{
"name": "Project E",
"path": "./repositories/project_E"
},
{
"name": "Project F",
"path": "./repositories/project_F"
},
{
"name": "Project G",
"path": "./repositories/project_G"
},
{
"name": "Project H",
"path": "./repositories/project_H"
},
{
"name": "project I",
"path": "./repositories/project_I"
},
{
"name": "Project J",
"path": "./repositories/project_J"
},
{
"name": "Project K",
"path": "./repositories/project_K"
},
{
"path": "./repositories/project_L",
"name": "Project L"
},
{
"path": ".",
"name": "Master"
}
],
"settings": {
"markdown.extension.print.imgToBase64": true,
"editor.multiCursorModifier": "alt",
"editor.renderWhitespace": "boundary",
"editor.wordWrap": "on",
"diffEditor.ignoreTrimWhitespace": false,
"git.autofetch": true,
"markdown.extension.print.absoluteImgPath": false,
"markdown.extension.print.validateUrls": false,
"markdown.extension.toc.levels": "2..6",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"files.exclude": {
"node_modules": true,
"dist": true,
"repositories": true
},
"editor.defaultFormatter": "dbaeumer.vscode-eslint",
"[javascript]": {
"editor.defaultFormatter": "dbaeumer.vscode-eslint"
},
"[jsonc]": {
"editor.defaultFormatter": "vscode.json-language-features"
},
"editor.tabSize": 2,
},
"extensions": {
"recommendations": [
"yzhang.markdown-all-in-one",
"stamminger.vscode-markdown-preview-include",
"DavidAnson.vscode-markdownlint",
"Arjun.swagger-viewer",
"bierner.markdown-checkbox",
"bierner.markdown-mermaid",
"christian-kohler.path-intellisense",
"dbaeumer.vscode-eslint",
"eamodio.gitlens",
"esbenp.prettier-vscode",
"FredJeck.fav",
"markvincze.code-fragments",
"mhutchie.git-graph",
"mikeburgh.xml-format",
"ms-vscode.js-debug",
"ms-vscode.references-view",
"ms-vscode.vscode-js-profile-table",
"ms-vsliveshare.vsliveshare",
"redhat.vscode-yaml",
"telesoho.vscode-markdown-paste-image",
"vespa-dev-works.jestRunIt",
"VisualStudioExptTeam.vscodeintellicode"
]
}
}
I generated a local plugin and created an article model using:
"pluginOptions": {
"i18n": {
"localized": true
}
},
inside his article.settings.json file, in order to make some specific fields translatables using the Internationalization(I18N) plugin
Problem is, while running the command:
strapi develop --watch-admin
I end up having the following errors:
error Something went wrong in the model "Article" with the attribute "localizations"
error TypeError: Cannot read property "uid" of undefined
Removing the "pluginOptions" instead, gives my local plugin running without any translatable field or articles__translations pivot that should be generated into my mysql database
"pluginOptions" is the very same parameter that gets generated into the model settings creating a collection type using the Content-Types Builder, but I can't have it to work while using it for a local plugin.
Here is my article.settings.json:
plugins/blog/models/article.settings.json
{
"kind": "collectionType",
"collectionName": "articles",
"info": {
"name": "article"
},
"options": {
"draftAndPublish": false,
"timestamps": true,
"populateCreatorFields": true,
"increments": true,
"comment": ""
},
"pluginOptions": {
"i18n": {
"localized": true
}
},
"attributes": {
"title": {
"pluginOptions": {
"i18n": {
"localized": true
}
},
"type": "string",
"required": true,
"maxLength": 255,
"minLength": 3
},
"slug": {
"pluginOptions": {
"i18n": {
"localized": true
}
},
"type": "uid",
"targetField": "title",
"required": true
},
"featured": {
"pluginOptions": {
"i18n": {
"localized": false
}
},
"type": "boolean",
"default": false
},
"published_date": {
"pluginOptions": {
"i18n": {
"localized": false
}
},
"type": "datetime"
},
}
}
You can use the content-type-builder plugin as a workaround. You would not create the content type under the content-types folder but create it programmatically.
As an example of a very simple tag content type:
{
"singularName": "tag",
"pluralName": "tags",
"displayName": "tag",
"description": "",
"draftAndPublish": false,
"pluginOptions": {
"i18n": {
"localized": true
}
},
"attributes": {
"label": {
"type": "string",
"pluginOptions": {
"i18n": {
"localized": true
}
},
"unique": true
}
}
}
Note, this schema of the json is a bit different from the ones in plugin/server/content-types.
Then you can create the content type programmatically like this:
import { Strapi } from "#strapi/strapi";
import tag from "../content-types/tag.json";
import page from "../content-types/page.json";
export default ({ strapi }: { strapi: Strapi }) => ({
async createContentComponent() {
if (!tag) return null;
try {
const components: any = [];
const contentType = await strapi
.plugin("content-type-builder")
.services["content-types"].createContentType({
contentType: tag,
components,
});
return contentType;
} catch (e) {
console.log("error", e);
return null;
}
},
});
This is exactly how the admin creates content types using the content builder UI.
And it works using the pluginOptions.i18n.localized: true.
One approach would be to do this, e.g., on the bootstrap phase of the plugin. Here you could also check whether or not the contents are created or not.
As a bonus, you can also create components that otherwise would not work.
Hope that helps.
Links:
Create components programmatically in a plugin: https://github.com/strapi/strapi-plugin-seo/blob/main/server/services/seo.js
Create content types:
https://github.com/strapi/strapi/blob/88caa92f878a068926255dd482180202f53fcdcc/packages/core/content-type-builder/server/controllers/content-types.js#L48
EDIT:
You could also keep the original schema and use this fn to transform it - at least for now as long as the other approach is not working:
https://github.com/strapi/strapi/blob/1eab2fb08c7a4d3d40a5a7ff3b2f137ce0afcf8a/packages/core/content-type-builder/server/services/content-types.js#L37
I have barebone Flutter 2.5 project and Figma design tokens which were exported via Figma Tokens.
Those design tokens look like this:
project\style_dictionary\properties\tokens.json
{
"borderWidth": {
"100": {
"value": "1.5",
"type": "borderWidth"
}
},
"opacity": {
"basic": {
"100": {
"value": "0.04",
"type": "opacity"
}
}
},
"colors": {
"basic": {
"red": {
"50": {
"value": "#ffebee",
"type": "color"
}
}
}
}
}
and Style Dictionary config which looks like this
project\style_dictionary\config.json
{
"source": [
"properties/*.json"
],
"platforms": {
"flutter": {
"transformGroup": "flutter",
"buildPath": "../lib/unique_file/",
"files": [
{
"destination": "style_dictionary.dart",
"format": "flutter/class.dart",
"className": "StyleDictionary"
}
]
},
"flutter-separate": {
"transformGroup": "flutter-separate",
"buildPath": "../lib/unique_file/",
"files": [
{
"destination": "style_dictionary_color.dart",
"format": "flutter/class.dart",
"className": "StyleDictionaryColor",
"type": "color",
"filter": {
"attributes": {
"category": "colors"
}
}
}
]
}
}
}
Running style-dictionary build in CMD in style_dictionary will generate next file
project\lib\unique_file\style_dictionary_color.dart
import 'dart:ui';
class StyleDictionaryColor {
StyleDictionaryColor._();
static const basicRed50 = #ffebee;
}
But in should be like that at the end
project\lib\unique_file\style_dictionary_color.dart
import 'dart:ui';
class StyleDictionaryColor {
StyleDictionaryColor._();
static const basicRed50 = Color(0xFFFFEBEE);
}
Question:
How and where can I create Style Dictionary transforms file to create right dart file with Color type of the static variable?
I cannot modify exported design tokens.
Create a project\build.js as a custom Transforms file. Logic of creation was used from default Flutter color transforms and Documentation
const StyleDictionary = require('style-dictionary')
const baseConfig = require('./style_dictionary/config.json')
const Color = require('tinycolor2')
StyleDictionary.registerTransform({
name: 'colors/hex8flutter',
type: 'value',
matcher: prop => {
return prop.attributes.category === 'colors'
},
transformer: prop => {
var str = Color(prop.value).toHex8().toUpperCase();
return `Color(0x${str.slice(6)}${str.slice(0, 6)})`;
},
})
const StyleDictionaryExtended = StyleDictionary.extend(baseConfig)
StyleDictionaryExtended.buildAllPlatforms()
Modify project\style_dictionary\config.json so it can be executed from project directory and include new transforms - "transformColorsToColor" together with other transforms from Flutter
{
"source": [
"style_dictionary/properties/*.json"
],
"platforms": {
"flutter": {
"transforms": ["attribute/cti", "name/cti/camel", "color/hex8flutter", "size/flutter/remToDouble", "content/flutter/literal", "asset/flutter/literal", "font/flutter/literal", "colors/hex8flutter"],
"buildPath": "lib/unique_file/",
"files": [
{
"destination": "style_dictionary.dart",
"format": "flutter/class.dart",
"className": "StyleDictionary"
}
]
},
"flutter-separate": {
"transforms": ["attribute/cti", "name/ti/camel", "color/hex8flutter", "size/flutter/remToDouble", "content/flutter/literal", "asset/flutter/literal", "font/flutter/literal", "colors/hex8flutter"],
"buildPath": "lib/unique_file/",
"files": [
{
"destination": "style_dictionary_color.dart",
"format": "flutter/class.dart",
"className": "StyleDictionaryColor",
"type": "color",
"filter": {
"attributes": {
"category": "colors"
}
}
}
]
}
}
}
Run npm init with all default answers
Run npm install --save tinycolor2
Run node build.js
I have a project with both JS and TS files (and JSX/TSX). I have a separate .eslintrc.json file for JS vs. TS. I'd like to be able to tell VSCode which eslint config file to use depending on the file extension.
Tried putting the settings in settings.json under the [typescript] field but that didn't work.
I think it should be possible to use 1 file and overrides option:
.eslintrc.js
module.exports = {
"root": true,
"plugins": ["#typescript-eslint"],
"rules": {
// JavaScript rules
},
"overrides": [
{
"files": ["*.ts", "*.tsx"],
"parser": "#typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.json"
},
"plugins": [
"#typescript-eslint"
],
"rules": {
// TypeScript rules
}
}
]
}
And changing workspace settings:
"eslint.validate": [
{
"language": "typescript",
"autoFix": true
},
{
"language": "typescriptreact",
"autoFix": true
}
]
How can I disable the "Copy" (but not cut / paste) functionality of the jsTree right click context menu?
This pretty much did the trick.
$("#housingTree").jstree({
"plugins": ["themes", "html_data", "ui", "crrm", "hotkeys", "contextmenu"],
"core": { "initially_open": ["phtml_1"] },
"contextmenu": {
"items": function ($node) {
return {
"Rename": {
"label": "Rename",
"action": function (obj) { this.rename(obj); }
},
"Create": {
"label": "Create",
"action": function (obj) { this.create(obj); }
},
"Delete": {
"label": "Delete",
"action": function (obj) { this.remove(obj); }
},
"Cut": {
"label": "Cut",
"action": function (obj) { this.cut(obj); }
},
"Paste": {
"label": "Paste",
"action": function (obj) { this.paste(obj); }
}
};
}
}
})
i dont know if the action functions are the default functions or custom functions, but that didnt work for me... anyway your post did set me in the right path! thanks!
this is how i did it, after finding another post:
"contextmenu": {
"items": function ($node) {
var tree = $("#html1Tree").jstree(true);
return {
"Rename": {
"label": "Rename",
"action": function (obj) {
tree.edit($node);
}
},
"Create": {
"label": "Create",
"action": function (obj) {
$node = tree.create_node($node);
tree.edit($node);
}
}
};
}
}
jsTree and Context Menu: modify items
The shorter approach could be
"contextmenu": {
"items": function(node) {
var defaultItems = $.jstree.defaults.contextmenu.items();
console.log("default items : "+JSON.stringify(defaultItems));
delete defaultItems.ccp.submenu.copy;
return defaultItems;
}
},
You can console.log(defaultItems). It wil print json representation of object. You can modify other properties also.
this is my easiest option.
All main code placed in "contextmenu.items" block.
$('#c-list').jstree({
"core": {
"themes": {"responsive": false},
"check_callback": true,
},
"types": {
"default": {
"icon": "fa fa-folder text-warning fa-lg"
},
"file": {
"icon": "fa fa-file text-warning fa-lg"
}
},
"contextmenu":{
'items' : function(node) {
var items = $.jstree.defaults.contextmenu.items();
items.ccp = false;
return items;
}
},
"plugins": ["contextmenu", "dnd", "types", "search", "wholerow","checkbox"]
});