Read a file with Parcel

I am using Parcel bundler in my javascript file, and I want to read the contents that are inside a file.



import mainFile from './main.devano' // custom file extension


this is some data

But I am unable to read that, instead when I console.log() it, I get the file path.

I use Parcel from time to time. I’m unsure about how you want to handle the file content itself. I think by default the file is just loaded as a static asset in the final built bundle, but parcel itself doesn’t know anything about the file or how you want to use it.

For example, if your file is a picture, what would console.log show? Idk, it isn’t text right? Parcel wont know, especially if your using some custom file extensions.

Assuming the file just has plain-text in it, you probably are best off making it a JS variable/string and loading it that way. Or you can take advantage of the file path parcel gives you and write code to “get it” via an HTTP request. (using fetch or similar)

I don’t really recommend making up a custom file extension unless you know what your doing as doing such can trip of parcel and your own code very easily.

I am going to treat it as raw text data. I am making a custom parser for a JavaScript library that I am working on.

Currently just trying things out.

If your goal is to focus more on the “parsing” side of things, I’d just save the data as a JS string, rather than worry about the technicalities of “getting the contents of the file to a point where JS can read it”.

You can always change where and how you actually get the text later depend on whatever your doing overall :slight_smile:

I have worked on the parser by using javascript strings. Just need to see it in action with separate file.

I don’t really get why you’re trying to do this. JS has a perfectly good module system, but it’s for JS, you can’t just import random files and expect it to work.

Parcel in theory doesn’t care what the file type is as long as you are specifying that you’re using the correct asset loader, and like most bundlers you can make it do weird things like “import” non-js files (because it doesn’t parse the files as JS).

So it’s literally just raw binary data that you want the bundler to treat as a string – you’re going to have to write some logic for an asset loader that says if there’s an import with the extension .devano, treat the contents as a string. I don’t use Parcel, so I don’t know how much work this is, but I really don’t see how there’s any point.

If you’re building something that takes text and parses it, you’re not going to be importing a text file into the app. So you seem to be giving yourself loads of work to do that won’t actually provide you any benefits. Just import a JS file that exports the string you want. That’s trivially easy and means you’re actually using modules and the language normally rather than adding what is effectively an extremely specific macro to do the same thing. (and if you want it to actually read local text files, then Node is what you use, you don’t need to bundle anything as it’s not frontend)