如何在故事书和 Next.js 中使用绝对导入？

Question

在我的.storybook/main.js文件中，我有：

 webpackFinal: async (config) => {
     config.resolve.modules = [
       ...(config.resolve.modules || []),
       path.resolve(__dirname),
     ];

     return config;
   },

但是当我运行我的故事书时，我得到一个错误：

resolve 'components/Common/Button' in '/myprojectpath/pages'
  Parsed request is a module
  using description file: /myprojectpath/package.json (relative path: ./pages)
    Field 'browser' doesn't contain a valid alias configuration
    resolve as module
      /myprojectpath/pages/node_modules doesn't exist or is not a directory
      looking for modules in /myprojectpath/node_modules

不知道发生了什么。 当我运行 Next.js 项目时，它加载正常。

提前致谢！

Answer 1

看起来像设置绝对路径问题： github issue

很可能，将解决

path.resolve(__dirname, ".."), "node_modules"]

或者

path.resolve(__dirname, "../src"), "node_modules"]