在 Webpack 中编译多个 Elm 项目

问题描述

我正在运行 Phoenix 服务器,其中的 Webpack 配置文件部分如下所示:

entry: {
  'elm-db': './elm-db/src/Main.elm','elm-ledger': './elm-ledger/src/Main.elm',},output: {
  filename: '[name].js',path: path.resolve(__dirname,'../priv/static/js'),publicPath: '/js/',module: {
  rules: [
    {
      test: /\.elm$/,exclude: [/elm-stuff/,/node_modules/],use: {
        loader: 'elm-webpack-loader',options: {
          cwd: path.resolve(__dirname,'elm-db'),debug: options.mode === "development",optimize: options.mode === "production",]
},

我有两个 Elm 项目,elm-dbelm-ledger。我已经设法将 elm-db 正确添加配置文件中,并且它可以很好地编译项目。但是,我一直未能添加“elm-ledger”。上面的代码生成一个正确的 elm-db.js 文件,但编译 elm-ledger.js 会返回错误,可能是因为我无法创建正确的 cwd 字段。我找不到有关 cwd 配置的任何文档。

解决方法

不确定这是否有帮助,但我们正在使用旧版本的 "elm-webpack-loader": "^6.0.1"(最新版本可能有不同的配置)


const elmPath = path.resolve(__dirname,'./node_modules/.bin/elm');
const srcPaths = [
  path.resolve(__dirname,'./app1'),path.resolve(__dirname,'./app2'),'./app3'),];

const elmRules = srcPaths.map(featurePath => ({
  test: new RegExp(`^${featurePath}.*elm$`),include: featurePath,exclude: [/elm-stuff/,/node_modules/],use: [
    {
      loader: require.resolve('elm-webpack-loader'),options: {
        pathToElm: elmPath,cwd: featurePath,// other options
      },},],}));

然后你在 Webpack 配置规则中传播 ...elmRules