@tarojs/webpack5-runner 提供获取 webpack 静态配置文件入口

[yoyo837]

trafficstars

这个特性解决了什么问题？

@tarojs/webpack-runner有 @tarojs/webpack-runner/dist/config/prod.conf.js 文件, @tarojs/webpack5-runner 没有类似的文件只有一个build (appPath: string, rawConfig: BuildConfig)方法, 其中BuildConfig很难模拟, 可以用在任何需要统一webpack配置的地方, 如 eslint-import-resolver-webpack + eslint-plugin-module-resolver的配置

这个 API 长什么样？

@tarojs/webpack5-runner/dist/config/prod.conf.js

[Chen-jj]

没太理解，要获取最终的 webpack 配置还是要干嘛？

[yoyo837]

没太理解，要获取最终的 webpack 配置还是要干嘛？

是的, 获取最终的配置

[Chen-jj]

应该使用 WebpackChain 的 chain.toConfig 就可以

[yoyo837]

应该使用 WebpackChain 的 chain.toConfig 就可以

请教一下, 一个普通的外部node.js文件, chain如何获得以调用toConfig呢?

[AdvancedCat]

config/index.js 文件中的 mini.webpackChain 可以拿到 chain 对象. @yoyo837

[yoyo837]

不是的, 我需要一个外部node.js文件获得, 不是Taro的配置文件内的回调获得.

说直白一点,就是自己的空白node.js文件, 需要获得.

[yoyo837]

用在这里

[AdvancedCat]

你的意思是外部插件通过 require('...') 形式获取？prod.config.js抛出的是函数，如果外部插件支持 async 的话，可以在这个config上配置 async 函数，函数内部去await mini.webpackChain 呢？ 奇技淫巧，仅供参考

[yoyo837]

你这个方案得把taro dev给run起来吧?

[AdvancedCat]

你这个方案得把taro dev给run起来吧?

懂你意思了，你要在「非编译时」获取config参数。这样嘞？

const { MiniBaseConfig } = require('@tarojs/webpack5-runner/dist/webpack/MiniBaseConfig.js')
const chain = new MiniBaseConfig(...).chain

[yoyo837]

new MiniBaseConfig 参数特别是第二个config, 去哪里搞呢

[AdvancedCat]

new MiniBaseConfig 参数特别是第二个config, 去哪里搞呢

第二个 config 应该就是 config/index.js mini 的内容

[yoyo837]

那我就试试自己require 配置文件的index.js , 取到mini配置传进去看看.

[yoyo837]

调试了一下, 运行时的时候, new对象传进来的配置比较齐全, 和项目里/config/indes.js的可见配置还是有一定差异, 无法完全对等, 比如内部有处理一些默认值等等.

{
  entry: {
    app: [
      '/Users/tanghui/git/ydmap/web/ydmap-frontend-portal/src/app.config'
    ]
  },
  alias: {},
  copy: { patterns: [], options: {} },
  sourceRoot: 'src',
  outputRoot: 'dist/h5',
  platform: 'h5',
  framework: 'vue3',
  compiler: {
    type: 'webpack5',
    prebundle: { include: [Array], esbuild: [Object] }
  },
  cache: { enable: true },
  logger: undefined,
  baseLevel: undefined,
  csso: undefined,
  sass: { data: '@import "/src/assets/themes/variables.scss";' },
  uglify: undefined,
  plugins: [
    '@tarojs/plugin-html',
    '@dcasia/mini-program-tailwind-webpack-plugin/dist/taro'
  ],
  projectName: 'Portal跨端',
  env: {
    NODE_ENV: '"development"',
    TARO_ENV: '"h5"',
    FRAMEWORK: '"vue3"',
    TARO_VERSION: '"3.5.6"'
  },
  defineConstants: {},
  designWidth: 375,
  deviceRatio: { '375': 2, '640': 1.17, '750': 1, '828': 0.905 },
  projectConfigName: undefined,
  jsMinimizer: undefined,
  cssMinimizer: undefined,
  terser: undefined,
  esbuild: undefined,
  router: { mode: 'browser' },
  publicPath: '/',
  staticDirectory: 'static',
  esnextModules: [ 'nutui-taro' ],
  postcss: {
    autoprefixer: { enable: true, config: {} },
    cssModules: { enable: true, config: [Object] }
  },
  webpackChain: [Function: webpackChain],
  htmlPluginOption: {
    templateParameters: {
      isProd: false,
      taroEnv: 'h5',
      timestamp: 1664195993823,
      UA_PARSER_JS_VERSION: '1.0.2'
    }
  },
  devServer: {
    client: { overlay: [Object] },
    port: 9087,
    allowedHosts: 'all',
    proxy: { '/srv*/api/**': [Object] }
  },
  frameworkExts: [ '.vue' ],
  isWatch: true,
  mode: 'development',
  blended: false,
  isBuildNativeComp: false,
  modifyWebpackChain: [Function: modifyWebpackChain],
  modifyBuildAssets: [Function: modifyBuildAssets],
  modifyMiniConfigs: [Function: modifyMiniConfigs],
  modifyComponentConfig: [Function: modifyComponentConfig],
  onCompilerMake: [Function: onCompilerMake],
  onParseCreateElement: [Function: onParseCreateElement],
  onBuildFinish: [Function: onBuildFinish],
  entryFileName: 'app',
  sassLoaderOption: { additionalData: '@import "/src/assets/themes/variables.scss";' }
}

[ZakaryCode]

懂你意思了，你要在「非编译时」获取config参数。

或许 #15144 可以满足这一需求，创建端平台插件实例并 start 方法或者直接调用 runner 传入指定参数，通过 withoutBuild: true 跳过编译，同时可以使用 modifyWebpackChain 获取最终配置。这应该在各端都可以通用

[yoyo837]

懂你意思了，你要在「非编译时」获取config参数。

或许 #15144 可以满足这一需求，创建端平台插件实例并 start 方法或者直接调用 runner 传入指定参数，通过 withoutBuild: true 跳过编译，同时可以使用 modifyWebpackChain 获取最终配置。这应该在各端都可以通用

谢谢，确实是这个意思，我表述得不太好。我找时间看看上述。