Is there a way to customize the auto formatting of imports?
make of this kind
Here is the format
I thought prettier would help me
vs code includes a default code formatter for typescript , to keep all the imports in the same line , use it with : right click > format document with > functionality of typescript and javascript languages
if you mean a formatter to switch between image 2 and image 1, you will need to write your own formatter
Related
My Project: A React JS library (Not Typescript) created with create-react-library.
The library works as expected.
My Question: How do I get the tooltips/hints in the editor where my packages is used?
Currently: If I import one of my components e.g
<Notice color='red' text='Warning'/>
When I hover over over Notice the tooltip shows
(alias) function Notice(_ref: any): any
import Notice
What I am looking for is a tooltip to show info along the lines of Notice (color, text)...
A few ideas I had was some kinda JS docs? or possibly I need typescript and it isn't possible with JS (but this doesn't seem right)?
While I'm usually an expert googler, I don't know enough about the issue and all I can seem to arrive at are 'JS tooltip turorials'. Any direction at all is appreciated. :)
I am building a nextjs application. In my project I am not using TypeScript. I am using Javascript. I need a horizontal scroll on mouse wheel and also on touch. I haven't find any react packages. But I find one react package - react-horizontal-scrolling-menu. I see all demo. It perfect for my project. But I am facing one problem. Al of it's example create in TypeScript. But I am not using typeScript. If I copy the code, Then I get many error?
https://codesandbox.io/s/no-scrollbar-and-buttons-position-c3kn5?file=/src/index.tsx
In this situation, What I have to do. I am not understanding?
Please can anyone help me. I am facing this issue over 10 days. Please do not dislike or close my questions.
Converted to JavaScript. You only needed to remove types and change tsx, ts to jsx, js.
https://codesandbox.io/s/no-scrollbar-and-buttons-on-bottom-forked-m2wci
You just need to get rid of every type definition of typescript. Every type in TypeScript is written after the variable name behind ":". So, in the codesandbox example, remove things like ": number" or ": void" at the end of functions.
Edit: im on mobile now, so i can't send you the Javascript code. The things you should look for are on line 17, 20 and 57. Hope the helps you.
I am using also the component for my project which not typescript. As someone suggested I just removed the type definitons in the Arrow function.
I'm wondering if there is a way to change the indent size when formatting javascript in VSCode.
I found this
git commit that adds quite a few formatting options for JS but I don't see any ability to change indent size.
Anyone know of a way to do this?
--Edit--
I have already tried to change the indent size at the bottom of the editor.
Toolbar Image (can't embed images yet...)
I have also tried changing the detect indentation setting.
"editor.detectIndentation": false
But when I format it still uses two spaces.
I use a plugin called JS-CSS-HTML Formatter. It does exactly that, the ability to change editor settings for different file types.
https://marketplace.visualstudio.com/items?itemName=lonefy.vscode-JS-CSS-HTML-formatter
Been trying to decide between using CodeMirror or Ace editor. I've been leaning towards CodeMirror, however there's one feature of Ace that I really like and that is how it does syntax validation. So as I'm typing there can appear a warning or error icon in the left gutter area beside the line number, and when I hover over it it gives me a little description.
Is there any way to get this functionality in CodeMirror? Specifically, I'm using the css mode for CodeMirror.
It'd also be nice to be able to add in my own custom validation.
Thanks.
see http://codemirror.net/3/demo/widget.html for a nice demo.
but ace have other nice features too. For me deciding factors were multiple cursors and indentGuides
For Ace adding your own validation function is quite simple.Here is how we added validation for CSS using CSSLint:
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/css_worker.js
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/css.js#L78
I am using the Mac OS X terminal.
Most of the default color schemes I try in vim use terrible red colors for my JavaScript code.
Most of the code appears red. Does anyone know how to set the colors for JavaSript files in vi?
Whatever you do with custom syntax files and colorschemes will be useless if you don't tweak the color settings of Terminal.app and/or switch to iTerm2 or MacVim.
Most colorschemes are made for the GUI versions of vim or for vim running in a terminal that supports 256 colors.
Terminal.app only supports 16 colors and the basic colors are horrible, you can tweak them with TerminalColoreopard but you still have only a very limited palette to work with when tweaking your colorscheme.
So, that's one part of the problem.
Another one is probably that your document's filetype is set to html which prevents you to have good JS syntax highlighting and proper omni completion. You can change that by typing :set ft=html.javascript.
The last part of your problem is that you use inline JavaScript.
--- EDIT ---
It's 2016, now, and Terminal.app has no problem whatsoever displaying 256 colors so there's no need for that "TerminalColoreopard" hack anymore.
--- ENDEDIT ---
I've modified 2 files to fit my javascript workflow.
Yi Zhao's Javascript syntax: I've added AJAX, DOM keywords, methods and others.
ir_black: I called it Nazca, and it has some lines combined with with my syntax makes the js files look a lot better than the stock syntax.
Please check them out, they are not perfect but if you can fix it, add more features, please share.
UPDATE: Modification to your colorscheme is no longer required since the new version of the script hilinks all the new introduced highlights to existing keywords. Follow it in github
This question is a lot like this one:
Javascript syntax highlighting in vim