Doesn't compile a npm linked module

[acnovais]

Not sure this is a babel loader issue or a webpack issue.

I am developing two modules and one of them has a dependency on the other. So I have npm linked it.
I have the following config on webpack:

loaders: [{
      test: /\.js$/,
      loaders: ['babel'],
      exclude: /node_modules\/(?!other-module)/,
      include: __dirname
}]

This works fine if I install dependency as a local dependency but if I use npm link, babel doesn't process it.

Am I missing something? Or is there a workaround for this?

[cdaringe]

interesting, I just ran into this issue as well. however, i did unlink, make a copy, clear my node modules, and retry in the copy, with no results. unsure at this point. will continue to debug

[scriptjs]

Your config is not right. You need to include babel presets in your loader config as well as your babelrc or babelConfig in your package.json. The presets for babel loader can be added with query params or query object. Review the babel 6 docs on presets for your babel config. The preset packages must also be included your project. Currently things are working for me with babel-loader@6.01 with babel presets and babel-core@6.1.4

[cdaringe]

perhaps you're right. I never installed all of the deps. Likely part of a major bump? Readme ref

[henit]

I have the same issue. I have a package at /path/to/project/ and a dependency that worked well when located in /path/to/project/node_modules/dependency/. However, when I npm link the dependency to a git clone located at the same place as the project (/path/to/dependency/, linked via /usr/lib/node_modules the way npm links), then the loaders complain that there is no presets installed in the package directory for dependency when I run webpack from the project directory that npm links to it.

Webpack loader config in /path/to/project:

{
    test: /\.jsx?$/,
    loader: "babel-loader",
    query: {
        presets: ["es2015", "react"]
    }
}

Output from running webpack:

ERROR in ../dependency/index.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/path/to/dependency"

How can I make babel-loader use the presets installed in the project the same way it did when the dependency where located inside the project directory instead of looking for it in the linked project directory?

[scriptjs]

@henit Try putting the presets in your package.json instead with a babel property:

  "babel": {
    "presets": [
      "es2015",
      "react"
    ]
  },

[henit]

@scriptjs Gave the same webpack error as in my post above

Having the presets in neither the loader config or directly in the webpack config makes it complain about the syntax (since the file it is trying to include is in ES6). Once I include the presets in one of the two places, the syntax error is replaced by complaining that it does not find the preset modules. Whatever I do, I cannot get the loader to use the presets from the current project modules when importing files from a dependency that is located outside of the root of the package (since I have put the npm linked module in the directory above as described earlier).

I tried adding the resolve.fallback with the parent dir (where the linked dependency is located), did not help.

[scriptjs]

@henrit Perhaps there is something not sane in your babel dependencies impacting your project but you will need to investigate this. I am faced with something just about as strange. This is having an impact on a react native app project in a monorepo. If I remove the project out of the monorepo it compiles and runs. Within the monorepo it compiles but will not run due to an exception being thrown in react native since there is something global leaking into it from babel – from where is the question – and it is bugging the hell out of me. I too take advantage of npm link in this work.

There are a lot of moving parts atm. React, babel, npm are all moving simultaneously at a significant speed which only makes getting to the bottom of these things more difficult.

[Swaagie]

Seeing the same issue, building failed with an npm link module, after removing the link and manually copying over the locally developed module it worked fine. There is something odd with symlinks going on. Webpack config is as follow. Working with node@4.2 and npm@3.5.

'use strict';

const path = require('path');
const ucfirst = require('ucfirst');
const component = path.basename(process.env.COMPONENT);

module.exports = {
  entry: path.join(__dirname, component, 'index.jsx'),
  output: {
    filename: path.join(__dirname, component, 'dist', 'index.js'),
    library: 'UX' + ucfirst(component),
    libraryTarget: 'umd'
  },
  externals: {
    'prismjs': 'Prism',
    'react': 'React',
    'react-dom': 'ReactDOM'
  },
  module: {
    loaders: [{
      test: /\.jsx?$/,
      loader: 'babel-loader?presets[]=react,presets[]=es2015'
    }, {
      test: /\-example\.jsx?$/,
      loader: 'raw-loader'
    }]
  }
};

[Swaagie]

I'm pretty sure I've got those modules installed and it's not about the presets, babel-loader simply fails with symlinks

[skipjack]

Yea I agree with @Swaagie. The babel-loader fails to find it's preset modules when the module isn't under the project root containing the node_modules (even when resolveLoader.root is set). Similar to #166

[nirazul]

I can confirm that this has something to do with the location of the presets package.
My setup consists of two node_modules folders. One for a node-server and one for the frontend-build, which relies partially on webpack and webpack-stream.

<project-root>
    /node_modules
    /frontend
        /node_modules

I've first tried to use es2015 presets install dependency in the nested frontend folder. I've ended up getting the same error message as some others here:

ModuleBuildError: Module build failed: Error: Couldn't find preset "es2015" relative to directory "path/to/jsmainfile"

When installing it in the node_modules folder of the project root, it magically works. This made no sense to me, as babel-core as well as babel-loader and webpack are not installed within this folder.

So there must be something wrong with either the webpack option resolveLoader.root or babel-loader loading mechanism (or both).

[mqklin]

+++, related stackoverflow answer: http://stackoverflow.com/questions/34574403/how-to-set-resolve-for-babel-loader-presets/