poppinss / youch

Pretty error reporting for Node.js :rocket:

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Error: no such file or directory

JanLundholmGalante opened this issue · comments

Hi,
I got this error when using Youch as a Npm package: Error: ENOENT: no such file or directory, open "{my-project-path}/dist/error.compiled.mustache.

I have installed Youch with npm. Then using webpack to make a build in the folder named "dist". As you can se from the error message the dist folder is missing the file error.compiled.mustache. This file is in folder _node_modules/youch/src.

As I understand the problem.

  1. Npm installs the files in _node_modules
  2. Webpack creates a build of all used files (with tree shaking) and place in a output folder. In my case the dist folder.
  3. When running my code Youch will run from the dist folder, but the error.compiled.mustache is still in _node_modules/youch/src.
    4 I get the error above.

Possible solution:
In the file _node_modules/youch/src/Youch.js
make the following change:

// const viewTemplate = fs.readFileSync(path.join(__dirname, VIEW_PATH), 'utf-8')
const modulePath = path.dirname(require.resolve("youch"))
const viewTemplate = fs.readFileSync(path.join(modulePath, VIEW_PATH), 'utf-8')

The change above is working for me, but there might be better solutions.

Best regards
-Jan

Hey @JanLundholmGalante! 👋

Why are you using Webpack to build this package?
This is a backend package that should run directly on Node.js. It shouldn't be bundled nor transpiled.

Hi @RomainLanz! :)
I mostly work with web development and React. The application where I try to use Youch is a server side rendered (SSR) with React, which seems to be a beautiful solution for showing error.

When creating a SSR in React I use Webpack to bundle the client side scripts. Using Webpack also for the server brings a consistent way of building the application. For example Babel is implemented via Wepback for both server and client. Placing all files to a "shipping" folder is made the same way with Webpack.

There are some small performance benefits although not very important. Minify and "treeshake" get less code to ship and deploy.

Having a client and server Webpack configuration seems like a common approach when you have code on both sides (client and server). An interesting observation of this is that my VS Code icon theme gives me the Webpack icon for files named webpack.client.js and webpack.server.js but not for webpack.xyz.js.

Hi @RomainLanz @thetutlage @denis-sokolov @marcuspoehls
Is it desirable for Youch to support bundling with for example Webpack? Bundling server side code is a common scenario for server side rendered web applications. Support would increase the potential market. :)

If so... would you prefer to look at it yourself or get a pull request.
Best regards jan

Hello @JanLundholmGalante Happy to accept the PR :)