Sai Kishore Komanduri
Sai Kishore Komanduri's Blog

Sai Kishore Komanduri's Blog

FeathersJS Tip — On feathers transpilation, when using babel-register at server-side

Sai Kishore Komanduri's photo
Sai Kishore Komanduri
·Sep 16, 2020·

2 min read

If you look at the Module loaders section in FeathersJS docs, they recommend to transpile the packages under the @feathersjs scope, in the node_modules folder; as all of them are written in ES6

Official Solution

All modules in the @feathersjs namespace are using ES6. They must be transpiled to support browsers that don't completely support ES6. Most client-side module loaders exclude the node_modules folder from being transpiled and have to be configured to include modules in the @feathersjs namespace.


For webpack, the recommended babel-loader rule normally excludes everything in node_modules. It has to be adjusted to skip node_modules/@feathersjs. In the module rules in your webpack.config.js, update the babel-loader section to this:

  test: /\.jsx?$/,
  exclude: /node_modules(\/|\\)(?!(@feathersjs))/,
  loader: 'babel-loader'

Problem with babel-register

Since the @feathersjs/feathers package is client/server agnostic; it can be used at both front-end, and back-end; to make the feathers core available on both sides.

The problem occurs when we use something like babel-register at the server side.

Since the code is already transpiled, babel-register throws errors when trying to transpile the already transpiled code, during runtime.


To solve this, do not transpile any module under @feathersjs scope; instead use the special already-transpiled-to-es5 @feathersjs\client package.


$ npm install @feathersjs/client --save

@feathersjs/client is a module that bundles the separate Feathers client-side modules into one providing the code as ES5 which is compatible with modern browsers (IE10+). It can also be used directly int the browser through a <script> tag.

Here is a table of which Feathers client modules are included:

Feathers module@feathersjs/client
@feathers/feathersfeathers (default)
Share this