如何为Webpack设置根目录

Question

我正在为响应故事书配置webpack，并且导入语句路径出现问题。当我正常运行我的应用程序时，我的路径如下：

import { constructURLName } from "src/shared/utilities/stringManipulation";

我正在使用reactQL样板，并且已对其进行配置，以便它将基于src文件夹返回正确的模块。如何在故事书中复制它？故事书当前尝试在此处查找该stringManipulation文件：

/Users/me/development/reactQL/node_modules/src/shared/utilities/stringManipulation

因此它需要根据我的布局上一个目录：

node_modules
src
  pages
  ...
  shared
    utilities
      stringManipulation

这是我的js / jsx文件规则：

      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: [
          {
            loader: "babel-loader",
            query: {
              babelrc: false,
              presets: [
                ["env", { modules: false, exclude: ["transform-regenerator"] }],
                "react"
              ],
              plugins: [
                "transform-object-rest-spread",
                "syntax-dynamic-import",
                "transform-regenerator",
                "transform-class-properties",
                "transform-decorators-legacy"
              ]
            }
          }
        ]
      }, 

如何正确设置src目录？谢谢！

Answer 1

您可以使用resolve.modules。

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