I've a JSON file which I want to load in a Typescript class. Normally a syntax for that is
let json = require('file.json');
// Use of json file in TS class
This works perfectly fine under normal circumstances. But when I try to compile entire code with webpack, code doesn't work. I see the output code is replaced with following
var json = __webpack_require__(2);
This doesn't make much sense. Can somebody tell me what's going on under the hood and how to fix this issue?
You need to configure WebPack to load JSON files.
https://github.com/webpack/json-loader
Related
I'm trying to require some JSON files in my React app (based on CRA 3.01 with Typescript).
The normal const obj = require('./path/file.json') would work if my files had a .json extension - however, these files have .md for 'metadata' and a couple other extensions, and the standard require isn't working. The files are from a tool, so changing to .json isn't a practical option.
Doing some research, it seems the approach is to use the webpack json-loader module (the webpack json-loader docs says that working with different file extensions is the main reason for using the module). I found an example and am using this:
const context = require.context(
"json-loader!./metadata",
true,
/^\.\/.*\.md$/
);
const metadata = context("./foo.md");
I've got a minimum reproduction here (see App.tsx):
https://github.com/ericsolberg/testjson
It seems that this is correctly using the json-loader, and finding the file correctly. However, I'm getting a syntax error:
Error: Module build failed (from ./node_modules/json-loader/index.js):
SyntaxError: Unexpected token m in JSON at position 0
at JSON.parse (<anonymous>)
at Object.module.exports (/Users/***/projects/jsontest/node_modules/json-loader/index.js:4:49)
I did some research on this error, and believe the problem is that the file is being parsed twice - first by the loader configured by CreateCreactApp's default webpack config, then by the specified JSON loader.
I don't want to eject my CRA app to modify the webpack config, and would like to avoid a re-wire hack (and whatever other issues that introduces) ... does anyone know of a way to load JSON files in a CRA app, if these files don't have a JSON extension?
Here's the solution that ended up working for me.
I could eject my project, of course, and customize the webpack config to load JSON files with other extensions. It may be possible to make a rewire hack work as well.
But I realized that when I require a file that is not one of the extensions recognized by CRA's config, it instead copies that file into the build, and require('file.ext') returns the URL of the file. So I'm using axios to load the file. This means a trip to the server for something that could be done statically, but for where I'm taking this project that is actually OK (eventually it will load metadata from a server anyway).
I exported my local MongoDB Collections using the JSON file type on my pc. Then I wanted to import these Collections on my root server using MongoDB Compass.
Everytime when I try to export the Collection, it throws the following error:
That's how my JSON file looks like:
{..."settings":{"inventory":{"crate":{"$numberInt":"0"},"cratekey":{"$numberInt":"0"},"pickaxe":{"$numberInt":"0"},...}
(I don't know if it's relevant to answer this question but this JSON line is just 1/142000)
How can I fix this error?
TL;DR
You need to have 1 empty line at the very bottom of the json file.
Long version
I don't know if this will help your case, but I ran into a similar issue when trying to import json data. I had 1 document per line, but something was still wrong. I then exported a similar piece of data as json, and tried playing around with it to see what was causing the issue. It turns out that the json must have an empty line at the bottom. So let's say you have 1 document to import. You place the entire document onto the first line. Then you just hit enter and create the second line at the bottom. After this, my data was imported without a problem.
So the problem is you need to minify your json document. That is it should be in one line. So here's link to website where you will paste your json document on the left and get the minified document on the right. It worked for me. I hope this also helps you.
https://codebeautify.org/jsonminifier
I had exact same problem, apparently their should be one document per line.
However use https://studio3t.com/ it'll work fine.
i am building an extension to parse json using vs code extension.
so my need is ,it should be able able to load .json file from a particular folder and iterate through content of the file.
Then it should allow user to select few keys from it make a new json file out of this and save it in any folder.
But i am not able to find any way to read and write files in "vs code extension".Could someone please help me.
If you want to read the current edit state of a file you can use the following API workspace function:
vscode.workspace.openTextDocument(uri).then((document) => {
let text = document.getText();
});
This will show you the current state of the file including unpersisted changes. document is of type TextDocument and has isDirty set to true if it has pending changes.
Since the extension runs in nodejs, you should be able to use any nodejs module built-in or installed by npm in the usual way.
For your purpose you will be OK with the built-in fs module: https://nodejs.org/dist/latest-v6.x/docs/api/fs.html
In your extension you will need to import the required module, so your code file should contain this:
let fs = require("fs");
and then use the methods in the usual way, eg. fs.fileReadSync( filename, encoding ) ...
Please not that there is one exception. If you install a nodejs module containing compiled, binary code, it will not run in the extension and instead you will see an error message saying something like %1 is not a valid Win32 application. Pure javascript modules are OK, though.
VSCode extensions are running in node.js. Therefore you can use any available node.js package/module within your extension. For instance, check out this question for reading JSON.
For JSON, you just need to require or import the JSON file, such as:
const jsonObject = require('./myJSONfile.json');
// do something
For JSON with comments, you can use node-jsonc-parser.
After the manipulation, you could use the fs module of nodej.js to write to the disk.
i want to read read the Wordpress Export XML with nodejs to JSON.
After i am done with the manipulation of the data i want to import it to Wordpress. So i need to convert json to XML.
I tried different npm script, but nothing working out of the box.
I have read the documentation on Wordpress that is is using
This format, which is called and WordPress eXtended RSS or WXR file
So how can i solve this problem?
Exampel of what i tried before.
var oldprice = req.files['oldprice'].buffer.toString();
var json = xml2json.toJson(oldprice);
console.log(json);
Got it to work with this lib. Dont know way it wouldn't work with the other...
https://github.com/Leonidas-from-XIV/node-xml2js
I need to do this using Ant in an Eclipse project:
Read a JSON file (that is located inside my Eclipse project), parse it, so I can make a change on one of the attributes in there, and finally write the resulting JSON back to the same file.
Is this possible? I have tried using an approach of using with JavaScript, but I can't even reach the file without specifying an absolute path (that I don't want to do, I'd prefer this to be relative to the Ant script.)
Thanks in advance