Cant resolve modules

[kuongknight]

In webpack config we have: resolve: { modules: [path.resolve(__dirname, '../src'), 'node_modules'], }
But when import Link from 'components/Link'
Found error:
Error: Cannot find module 'components/Link'

[frenzzy]

You need to explicitly specify this option for client and server config separately, because webpack mutates this section =/

// tools/webpack.config.js

// ...

const clientConfig = {
  // ...
  resolve: {
    modules: [path.resolve(__dirname, '../src'), 'node_modules'],
  },
  // ...
};

const serverConfig = {
  // ...
  resolve: {
    modules: [path.resolve(__dirname, '../src'), 'node_modules'],
  },
  // ...
};

// ...

[kuongknight]

currently we have:

const config = {
resolve: {
    modules: [path.resolve(__dirname, '../src'), 'node_modules']
  }
}
const clientConfig = {
  // ...
  resolve: { ...config.resolve },
  // ...
};

const serverConfig = {
  // ...
  resolve: { ...config.resolve },
  // ...
};

But it not working

[kuongknight]

Please help me resolve this issue :)

[frenzzy]

If you want to use absolute paths to your modules you also need to mark your modules as internal here for server-side bundle or copy them manually to the build folder so that build/server.js can find them.

[Kohze]

If you want to use absolute paths to your modules you also need to mark your modules as internal here for server-side bundle or copy them manually to the build folder so that build/server.js can find them.

the link is not working or private - have a similar issue with installing react-office-fabric and then not resolving because of the /src/ in between the path resolve.

[langpavel]

@frenzzy Private links should not be here :-)

[langpavel]

@Kohze Are you still interested or this can be closed? If so, reopen please :-)

[frenzzy]

oops, was a wrong link)

[kuongknight]

@frenzzy can you write sample internals config for src folder?

[frenzzy]

sure, for example if you want to make import Header from 'src/components/Header' works:

// tools/webpack.config.js

// ...

const clientConfig = {
  // ...
  resolve: {
    modules: [path.resolve(__dirname, '..'), 'node_modules'],
  },
  // ...
};

const serverConfig = {
  // ...
  resolve: {
    modules: [path.resolve(__dirname, '..'), 'node_modules'],
  },
  externals: [
    /^\.\/assets\.json$/,
    (context, request, callback) => {
      const isExternal =
        request.match(/^[@a-z][a-z/.\-0-9]*$/i) &&
        !request.match(/^src\//i) && // module is not external if starts with `src/`
        !request.match(/\.(css|less|scss|sss)$/i);
      callback(null, Boolean(isExternal));
    },
  ],
  // ...
};

// ...

[comerc]

... and solution for Atom js-hyperclick