respect wepack export condition for importing

未关闭
#27,100 4 条评论 12 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
4/5
预计耗时
3-5 天
新手友好度
35/100
Issue 类型
功能
描述清晰度
基本清楚
活跃度
停滞
技术栈
sass, scss, typescript, webpack

调研方向

从 packages/angular_devkit/build_angular/src/tools/webpack/configs/styles.ts 大约第 382 行开始,跟踪 style 导入如何解析包的导出条件。使用包示例执行 build、extract-i18n、serve 和 test 命令;当 webpack 选择其条件,并且现有的 sass、less 和 style 解析继续正常工作时,即表示完成。

由索引模型根据 Issue 内容生成。

描述

area: @angular-devkit/build-angular devkit/build-angular:browser feature feature: insufficient votes
Command

build, extract-i18n, serve, test

Description

The root problem I am trying to solve is the different import behavior of esbuild and webpack for url resources like described here ( https://github.com/angular/angular-cli/issues/24470 ).

We have a npm package shipping company fonts and scss file to import them.

I know that there are other possibilities, but I also discovered that we could have different entrypoints for webpack and esbuild
when using conditions in the package.json as described here: https://webpack.js.org/guides/package-exports/#conditions-preprocessor-and-runtimes.

This was leading me to this package.json

  "exports": {
    "./styles/*": {
      "webpack": {
        "sass": "./dist/styles/webpack/*.scss",
        "less": "./dist/styles/webpack/*.less",
        "style": "./dist/styles/webpack/*.css"
      },
      "sass": "./dist/styles/*.scss",
      "less": "./dist/styles/*.less",
      "style": "./dist/styles/*.css"
    },
    "./*": "./dist/fonts/*"
  }

The only problem here is, that this does not work. Webpack is loading the normal sass styles.

Describe the solution you'd like

It would be really cool if the webpack condition is matched.

Describe alternatives you've considered

We could offer a scss variable so that consumers can override the font path or just casually export the file. This still does not solve the problem when using esbuild and the karma runner but at least they could do something.

I am not sure how much effort it is fixing this, but in case you just need to add webpack here: https://github.com/angular/angular-cli/blob/main/packages/angular_devkit/build_angular/src/tools/webpack/configs/styles.ts#L382 it would be really cool if you could do it.

主要语言
TypeScript
星标
27k
派生
11.8k
平均合并
16 小时 35 分钟
30 天内合并 PR
176

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

angular/angular-cli 的其他 Issue

查看 angular/angular-cli 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。