JSON package for Atom
License: Other
Adds syntax highlighting of JSON files in Atom.
Originally converted from the JSON TextMate bundle.
Contributions are greatly appreciated. Please fork this repository and open a pull request to add snippets, make grammar tweaks, etc.
I wanted to add jscsrc as a file type. Would be nice if one could just add file types in the options, instead I had to get into the actual code and with the next update my update will be gone :(
If I start with this:
{
"data": [{
"key": "value"
}, {
"key": "value"
}]
}and copy the contents of the array, then insert the cursor immediately before the closing brackets, then paste, I get this:
{
"data": [{
"key": "value"
}, {
"key": "value"
}, {
"key": "value"
}, {
"key": "value"
}]
}Notice the bad indentation on new objects.
I have auto indentation on:
I just upgraded to Atom v1.38.1, and all of the colors for JSON files look wildly different. Specifically, the keys and values are now the same color (see attached screen shot), whereas previously they were different. I don't know what packages provide this syntax highlighting functionality, so if more information is needed, or this issue needs to be posted somewhere else, please let me know!
› atom --version
Atom : 1.38.1
Electron: 2.0.18
Chrome : 61.0.3163.100
Node : 8.9.3
› apm --version
apm 2.1.7
npm 6.2.0
node 8.9.3 x64
atom 1.38.1
python 2.7.16
git 2.21.0
Although AFAIK JSON spec doesn't allow comments, some filetypes processed by this package do allow them (mostly config files, .jshintrc as an example), and they can be rather userful. Now comments in such files are highlighted as errors.
Maybe it's worth adding a package setting for this?
.eslintrc files are loaded by loadLegacyConfigFile which loads yaml (which happens to be a superset of json). The file is only explicitly parsed as json when it ends in .json (i.e., .eslintrc.json) as seen here.
Compare json syntax highlighting:
vs yaml syntax highlighting:
And while I haven't verified this, I believe this can lead to issues if a package is expecting a .eslintrc file to be strict JSON based on Atom thinking it is JSON.
After upgrading from 1.37.1 to 1.38.0, syntax highlighting of package.json is distracting and inconsistent:
All this blue underline styling was not present before and makes the file harder to read. Also, notice the inconsistencies: most of the keys get this treatment, but not all.
OS: Windows 10
$ atom --version
Atom : 1.38.0
Electron: 2.0.18
Chrome : 61.0.3163.100
Node : 8.9.3
$ apm --version
internal/child_process.js:323
throw errnoException(err, 'spawn');
^
Error: spawn UNKNOWN
at _errnoException (util.js:1024:11)
at ChildProcess.spawn (internal/child_process.js:323:11)
at exports.spawn (child_process.js:502:9)
at EventEmitter.<anonymous> (...\atom\app-1.38.0\resources\app\apm\lib\apm-cli.js:169:17)
at _combinedTickCallback (internal/process/next_tick.js:131:7)
at process._tickCallback (internal/process/next_tick.js:180:9)
Hi there, I'm using Atom 1.57.0 and JSON syntax highlighting has been broken for quite a while. Issues relating to this problem have been opened in this repo multiple times (here, here, here), but closed every time without resolution.
This is what my JSON files look like when I check "Use Tree Sitter Parsers" in settings:
As you can see, the JSON syntax highlighting is broken. Only when I disable Tree Sitter does the highlighting work as expected:
This is clearly an issue, because it is undesirable to keep Tree Sitters disabled as this breaks syntax highlighting in other languages like JavaScript and Python.
It seems this comment by @Arcanemagus explains what the issue is. By the sounds of it, tree-sitter-json is providing a correct syntax tree for the JSON, but something has changed with the way JSON is styled by Atom's themes, or the way the syntax tree is being interpreted by Atom's JSON grammar.
What can be done to get the issue fixed to make sure JSON files are highlighted correctly in Atom?
Please publish new release with the latest changes.
Trailing commas such as on line 3 below should be highlighted as syntax errors.
{
"foo": 1,
"bar": 2,
}I have this JSON:
{
"name": "angular-multi-select",
"version": "5.0.1",
"description": "A multi select dropdown directive for AngularJS",
"main": [
"angular-multi-select.js",
"angular-multi-select.css"
],
"repository": {
"type": "git",
"url": "[email protected]:alexandernst/angular-multi-select.git"
},
"dependencies": {
"angular": "1.3.15",
"angular-mocks": "1.3.15",
"angular-filter": "0.5.4",
"grunt-contrib-uglify": "0.9.1",
"grunt-contrib-jshint": "0.11.2",
"grunt-contrib-jasmine": "0.8.2"
},
"keywords": [
"angular",
"dropdown",
"multi",
"select",
"multiselect"
],
"author": "Alexander Nestorov <[email protected]> (https://github.com/alexandernst)",
"license": "MIT",
"bugs": {
"url": "https://github.com/alexandernst/angular-multi-select/issues"
},
"homepage": "https://github.com/alexandernst/angular-multi-select"
}And after I select all and hit Ctrl + Alt + P and write auto indent, Atom converts it to:
{
"name": "angular-multi-select",
"version": "5.0.1",
"description": "A multi select dropdown directive for AngularJS",
"main": [
"angular-multi-select.js",
"angular-multi-select.css"
],
"repository": {
"type": "git",
"url": "[email protected]:alexandernst/angular-multi-select.git"
},
"dependencies": {
"angular": "1.3.15",
"angular-mocks": "1.3.15",
"angular-filter": "0.5.4",
"grunt-contrib-uglify": "0.9.1",
"grunt-contrib-jshint": "0.11.2",
"grunt-contrib-jasmine": "0.8.2"
},
"keywords": [
"angular",
"dropdown",
"multi",
"select",
"multiselect"
],
"author": "Alexander Nestorov <[email protected]> (https://github.com/alexandernst)",
"license": "MIT",
"bugs": {
"url": "https://github.com/alexandernst/angular-multi-select/issues"
},
"homepage": "https://github.com/alexandernst/angular-multi-select"
}JSON highlighting is not applied on JSON file that contains long lines, even though grammar selector set to JSON.
Expected behavior: JSON highlighting applied where possible, observing long lines limit.
Actual behavior: No JSON highlighting applied, even though grammar selector set JSON.
VS code highlights and shows message Tokenization is skipped for lines longer than 20k characters for performance reasons.
Reproduces how often: Always
Atom : 1.34.0
Electron: 2.0.16
Chrome : 61.0.3163.100
Node : 8.9.3
apm 2.1.3
npm 6.2.0
node 8.9.3 x64
atom 1.34.0
python 2.7.10
git 2.17.2
Please treat .schema files as JSON.
Hi guys. Thanks for your work.
I'm using pm2 and it's configuration file called *.json5. Now I treat it like a general json with file-type plugin.
If this is regular json, can I create PR with additional json5 selector? If thing are more complicated any clarification appreciated.
Support a JSON with comments mode so that users can opt not to get errors when comments are used within JSON files (or ideally, within specific JSON file names, like .eslintrc and .eslintrc.json).
It is annoying to see linting errors when viewing such a file, and it deters one from adding helpful comments to ESLint RC files (ESLint config files support this format: https://eslint.org/docs/user-guide/configuring/configuration-files#comments-in-configuration-files ).
The existing language-json-comments package does not work for me.
While I understand JSON proper does not support comments, I think it makes sense for this existing package to implement since it appears that often the "json" extension is still used and Visual Studio treats this similarly as another mode
There is a spec for this and several parsers:
Hi there, I'm using Atom 1.57.0 and JSON syntax highlighting has been broken for quite a while.
Issues relating to this problem have been opened in the language-json repo multiple times (here, here, here), but closed every time without resolution. I opened another issue almost a week ago in the same repo, but it has been ignored.
To illustrate the problem, this is what my JSON files look like when I check "Use Tree Sitter Parsers" in settings:
As you can see, the JSON syntax highlighting is broken. Only when I disable Tree Sitter does the highlighting work as expected:
This is clearly quite a major issue, because it is undesirable to keep Tree Sitters disabled as this breaks syntax highlighting in other languages like JavaScript and Python. It's strange that such a major issue has gone unresolved for 2 years!
It seems this comment by @Arcanemagus explains what the issue is. By the sounds of it, tree-sitter-json is providing a correct syntax tree for the JSON, but something has changed with the way JSON is styled by Atom's themes, or the way the syntax tree is being interpreted by Atom's JSON grammar.
What can be done to get the issue fixed to make sure JSON files are highlighted correctly in Atom?
Use class .property.name instead of .string.quoted.double for json property names
Like this one (expected):
But now in atom:
When using the the field name remapping syntax for object descructuring the coming from names are highlighted in orange if they are surrounded by quotes but white if they are not
Reproduces how often: [What percentage of the time does it reproduce?]
Always
Atom : 1.24.0
Electron: 1.6.16
Chrome : 56.0.2924.87
Node : 7.4.0
apm 1.18.12
npm 3.10.10
node 6.9.5 x64
atom 1.24.0
python 2.7.10
git 2.16.2
I recently cut-and-pasted a long json string into Atom with "JSON" set as the active language. The syntax highlighter picked up the fields and values just fine, except that toward the end of the line, it appeared to give up and leave everything grey. I can replicate this by opening a new document, setting the active language to JSON and typing on a single line the following:
{"asdf": "asdf", "asdf": "asdf"... (many more) ... "asdf": "asdf"}
After character 160 in my editor, all the text is grey. Breaking the line causes the highlighting to kick in again, though it incorrectly flags one of the colons as an error.
I dont know why this issue is closed. Problem already present with latest Atom version
Expected behavior:
The text in the package.json file should be legible. Like, at least a decent contrast of dark against the light background.
Actual behavior:
The field names are in YELLOW. It's completely illegible.
Reproduces how often:
Consistently happening.
I've tried various plugins, and none address the issue.
I tried adjusting the styles.less via the scopes at cursor. Nothing took. Didn't change a thing.
I tried getting it to see the "sjson" file as a "json" file, and Atom just ignores it and sets it back to "sjson".
Atom version is 1.47.0x64, on Mac 10.13.6 High Sierra
Using One Light / Atom Light
Open package.json file.
It honestly looks like it was set up for a dark theme and someone figured it'd work fine for a light theme. I'd just be happy with a way to get Atom to recognize the package.json as a json file, so the usual json syntax would apply and I wouldn't be having to open this one file in Textmate just to read it.
(Note: my work version of Atom is a few versions behind, and that one recognizes package.json files as json files, so the syntax color is fine. No idea if this issue is a result of an upgrade or something in the package.json file itself -- all these years and I had no idea there was even a thing as an 'sjson' file type.)
Now, in last atom version (1.47.0) json syntax bug:
Must be:
Yet image:
When you open a JSON file (123 KB filesize) that has no line breaks, language-json crashes Atom 100 % of the time. If you disable language-json, the file opens without issues.
If you disable language-json and open the same file, there are no issues, even with a 1 MB json.
Expected behavior:
Should not crash the editor
Actual behavior:
Crashes the editor
Reproduces how often:
100 %
Atom 1.58.0
Electron 9.4.4
Chrome 83..0.4103.122
Node 12.14.1
apm 2.6.2
npm 6.14.13
node 12.14.1 x64
atom 1.58.0
python 2.7.18
git 2.3.0.1
MacOS 12.0 Monterey
When it crashes, there is a yellow message that appears:
Linter: Large/Minified file detected
Adding inline linter markers are skipped for this file for performance reasons (linter pane is still active)
There are two buttons: "Force enable" and "Change threshold", but they cannot be pressed. The editor has already crashed at this point and does not recover without force-closing.
[Description of the issue]
Expected behavior: [What you expect to happen]
Actual behavior: [What actually happens]
Reproduces how often: [What percentage of the time does it reproduce?]
You can get this information from copy and pasting the output of atom --version and apm --version from the command line. Also, please include the OS and what version of the OS you're running.
Any additional information, configuration or data that might be necessary to reproduce the issue.
It appears the code folding functionality is based on indentation (?) rather than syntax:
{
"level": "first",
"some_value": "value",
"children": [
{
"level": "second",
"some-value": "some",
"another-list": [
]
}]}
If I fold "children" above, "another-list" should be folded in, but is not
{
"level": "first",
"some_value": "value",
"children": [
"another-list": [
]
}]}
It would be nice to have a custom indentation style and size per language, so JSON would be 2 spaces, JavaScript would be 1 tab (2 spaces), etc.
There are several cases where JSON is used, but under a different extension. Many JavaScript linters use a .*rc JSON file for their configuration settings. Examples:
.jshintrc - JSHint.jslintrc - JSLint.eslintrc - ESLint[Enter steps to reproduce:]
Atom: 1.38.2 x64
Electron: 2.0.18
OS: Unknown Windows version
Thrown From: language-json package 1.0.4
Failed to load a language-json package grammar
At The specified module could not be found.
\\?\C:\Users\ryouta\AppData\Local\atom\app-1.38.2\resources\app.asar.unpacked\node_modules\language-json\node_modules\tree-sitter-json\build\Release\tree_sitter_json_binding.node in C:\Users\ryouta\AppData\Local\atom\app-1.38.2\resources\app.asar\node_modules\language-json\grammars\tree-sitter-json.json
Error: The specified module could not be found.
\\?\C:\Users\ryouta\AppData\Local\atom\app-1.38.2\resources\app.asar.unpacked\node_modules\language-json\node_modules\tree-sitter-json\build\Release\tree_sitter_json_binding.node
at process.module.(anonymous function) [as dlopen] (ELECTRON_ASAR.js:166:20)
at Object.Module._extensions..node (module.js:671:18)
at Object.module.(anonymous function) [as .node] (ELECTRON_ASAR.js:180:18)
at Module.load (module.js:561:32)
at tryModuleLoad (module.js:504:12)
at Function.Module._load (module.js:496:3)
at Module.require (/app.asar/static/index.js:60:45)
at require (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:146462)
at /app.asar/node_modules/language-json/node_modules/tree-sitter-json/index.js:2:20)
at /app.asar/node_modules/language-json/node_modules/tree-sitter-json/index.js:11:3)
at Module.get_Module._compile (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:147172)
at Object.value [as .js] (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:150720)
at Module.load (module.js:561:32)
at tryModuleLoad (module.js:504:12)
at Function.Module._load (module.js:496:3)
at Module.require (/app.asar/static/index.js:60:45)
at require (internal/module.js:11:18)
at customRequire (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:1:688769)
at new TreeSitterGrammar (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:3461672)
at GrammarRegistry.createGrammar (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:358917)
at l.readFile (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:358758)
at u (~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:578696)
at ~/AppData/Local/atom/app-1.38.2/resources/app/static/<embedded>:11:579949
at ELECTRON_ASAR.js:530:9
at FSReqWrap.wrapper [as oncomplete] (fs.js:658:17)
at /app.asar/node_modules/language-json/grammars/tree-sitter-json.json:1:1
atom-html-preview 0.2.6
atom-runner 2.7.1
autoclose-html 0.23.0
autocomplete-paths 2.12.2
autocomplete-php 0.3.7
autocomplete-ruby 0.2.8
browser-plus 0.0.98
busy-signal 2.0.1
color-picker 2.3.0
convert-to-utf8 0.2.4
docblockr 0.13.7
file-icons 2.1.32
git-plus 8.6.3
graphviz-preview 1.7.0
highlight-selected 0.16.0
hyperclick 0.1.5
intentions 1.1.5
japanese-menu 1.14.0
language-plantuml 0.2.0
linter 2.3.0
linter-php 1.6.1
linter-rubocop 2.2.5
linter-ui-default 1.7.1
plantuml-viewer 0.7.2
platformio-ide-terminal 2.9.1
pretty-json 2.1.2
rubocop-auto-correct 1.5.1
script 3.18.1
show-ideographic-space 1.0.2
While it might not be in the spec, lots and lots of JSON is hand-written with comment support - take chrome extension manifests, for example.
From a usability perspective, it makes sense to have support for comments. I don't see any downsides, but there are definite positives.
Would a PR to add comment support be accepted?
There's almost no syntax highlighting for JSON object. It should make things more readable if the keys had a distinct color.
#45, which supposedly fixed #11, introduced a regex that, in normal regex-land, should identify trailing commas after the last key-value pair in an object. This is strictly illegal syntax per the JSON spec: there is no trailing value-separator in 2.2 in https://www.ietf.org/rfc/rfc4627.txt , regardless of ignored whitespace. Node's implementation of the spec concurs:
> JSON.parse('{"a": 1,\n}')
SyntaxError: Unexpected token } in JSON at position 9
> JSON.parse('{"a": 1\n}')
{ a: 1 }
However, because Atom apparently feeds only one line at a time to the regex, and #45 handles newlines by placing them inside a lookahead group in a regex ... if there is a newline between the trailing comma and the end of the object, it will not be matched!
For anyone handcrafting JSON Schemas or config files (read: everyone these days) that will be read by strict parsers, this is a huge pain, especially since "trivial" config file changes that seem fine in an editor may break things in production, or only after a lengthy test run. More generally, we should strive to be compliant with the spec.
We may need to introduce a new scope in the grammar for the "space between a trailing comma and a closing }", rather than just having it as a lookahead. That way it would match over multiple lines.
In Atom console:
g = atom.grammars.grammarForScopeName('source.json'); JSON.stringify(g.tokenizeLines('{"a":1,\n}'), null, ' ')
Expected behavior: One token should have invalid.illegal.trailing-dictionary-separator.json scope.
Actual behavior: None of them do.
Reproduces how often: All the time.
atom --version
Atom : 1.17.0
Electron: 1.3.15
Chrome : 52.0.2743.82
Node : 6.5.0
apm --version
apm 1.17.0
npm 3.10.5
node 6.9.5 x64
python 2.7.12
git 2.7.1
OS 10.11.6
Any additional information, configuration or data that might be necessary to reproduce the issue.
It would be nice to display the json path of the element at the cursor position (or on mouseover maybe).
see https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en for an example (bottom of first image of the slideshow)
{
"id": "666",
"title": "Hello",
"pages": [
{
"number": 1,
},
{
"number": 2,
}
]
}These numbers are not proper JSON, yet they are matched by the current grammar.
n-level syntax highlighting is a great feature when reading JSON. Being able to see the nesting levels of keys makes reading large JSON significantly easier.
For example, sublime's material theme looks like this ::
Unfortunately, themes in atom can't add this due to a lack of current JSON grammars to support it.
Is this a possible feature language-json could support via classes such as .nesting.level{number}?
You have the core package "language-json" installed as a community package. See https://github.com/atom/dalek for how this causes problems and instructions on how to correct the situation.
<unknown> (<embedded>:13587:20)
Generator.next (null:null:null)
step (<embedded>:13574:279)
<unknown> (null:null:null)
process._tickCallback (internal/process/next_tick.js:188:7)
According to this Wikipedia page the extension for JSON-LD files is .jsonld, so it seems that this should be added to the list of those recognised by this package.
comments are all in red
Expected behavior: comments are not in red
**Actual behavior:**comments are in red and underlined
Reproduces how often: 100
Atom : 1.19.0
Electron: 1.6.9
Chrome : 56.0.2924.87
Node : 7.4.0
atom/language-json v 0.19.1
Hi There,
I got the need to comment my json files. Well, no problem about this regarding package itself. However, all comments are highlighted by language-json, and this is not eye catching. I think it confuses the readness of content. My suggestion is for language-json does highlight anything between comments, aka "/* ... */".
Best regards,
Miguel Mello
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.