Nx Storybook Webpack“开发”模式

Question

我正试图让我的 Storybook 停止输出缩小的 JS 和随后的无法追踪的错误......这似乎可能是由于 Nx 开箱即用配置 Webpack 的方式？不过，我似乎无法弄清楚如何改变这一点

// .storybook/webpack.config.js
/**
 * Export a function. Accept the base config as the only param.
 * @param {Object} options
 * @param {Required<import('webpack').Configuration>} options.config
 * @param {'DEVELOPMENT' | 'PRODUCTION'} options.mode - change the build configuration. 'PRODUCTION' is used when building the static version of storybook.
 */
module.exports = async ({ config, mode }) => {
  // Make whatever fine-grained changes you need

  // Return the altered config
  return config;
};

// .../.storybook/webpack.config.js
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const rootWebpackConfig = require('../../../.storybook/webpack.config');
/**
 * Export a function. Accept the base config as the only param.
 *
 * @param {Parameters<typeof rootWebpackConfig>[0]} options
 */
module.exports = async ({ config, mode }) => {
  config = await rootWebpackConfig({ config, mode });

  const tsPaths = new TsconfigPathsPlugin({
    configFile: './tsconfig.base.json',
  });

  config.resolve.plugins
    ? config.resolve.plugins.push(tsPaths)
    : (config.resolve.plugins = [tsPaths]);
...

运行命令： nx run exampleApp:storybook

关于如何解决的任何想法？

Answer 1

pitops on github 的解决方法

// webpack.config.js
config.plugins.forEach((plugin) => {
    if (plugin.constructor.name === 'DefinePlugin') {
      plugin.definitions['process.env'] = {
        NODE_ENV: JSON.stringify('development'),
        NODE_PATH: JSON.stringify(''),
        PUBLIC_URL: JSON.stringify('.'),
      }
    }
  })