dwyl/learn-environment-variables

Specify in readme that json-loader is required for webpack

Closed this issue ยท 11 comments

Or at least it was the case for me

https://www.npmjs.com/package/json-loader

p.s. hi ! ๐Ÿ˜„

Hi @hdrdavies! ๐Ÿ˜„
What was your use-case?
Node.js allows you to require .json files since v0.5 see: http://stackoverflow.com/a/7165572/1148249
Does WebPack not use node and then include the json object in your bundle?

It was slightly strange, it had problems locating 'fs', so I had to install that via npm also.

hmm...
so using https://www.npmjs.com/package/fs instead of native https://nodejs.org/api/fs.html ...?
sounds like WebPack is not doing its' job and making you jump through hoops... ๐Ÿ˜•

I don't understand what this code is meant to do... https://github.com/webpack/json-loader/index.js#L5-L9
How does json-loader "know" how to import/require the .json file?
(also, the lack of tests make me wonder if its a good idea to trust the package...)

Is Browserify a viable alternative here?

@ryanpcmcquen good question.
@rjmk might be able to shed light on the pros/cons of browserify / webpack ...

rjmk commented

Browserify tries to bring node-style requires to the frontend. Webpack is doing a bit more of its own thing. This explains why @hdrdavies (hi!) needs json-loader for his webpack flow -- it doesn't promise the node semantics for require.

Browserify by default has you digging around in its guts a bit less -- a transform is just supposed to be a function that takes in a file string. As @nelsonic pointed out, webpack plugins require a bit more familiarity with the ecosystem when reading.

Webpack is more batteries included, browserify is more userland-focused and easier to setup.

There's more to be said, but this gist and its comments (special mention to Dan Abramov on the pro-webpack side) say it pretty well.

For the record, I prefer browserify.

@hdrdavies are you still using WebPack...? would you mind PR-ing a section into the Readme with this insight.

p.s. agree with @rjmk prefer browserify over webpack ... or for new projects: http://rollupjs.org/

rjmk commented

Rollup's cool if you already have a transpilation step. My lingering reservation is that I'm not aware of any JS environment that supports ES6 modules yet (unlike most ES6 features, which, while lacking widespread support, are at least implemented in the latest version of most runtimes)

We are @nelsonic, but we're not using environment variables in our UI at the moment so I didn't get the above 'solution' working. I'll revisit the issue if we need environment variables in the future ๐Ÿ˜„

Closing as no longer relevant. โœ…
Hello to all in this thread hope 2022 is treating you well so far! ๐Ÿ‘‹