问题标签 [angular-builder]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - 在没有 ng serve 的情况下运行 angular dist
我的 Angular 应用程序有非常自定义的构建过程。我自己配置了 Webpack,没有使用 Angular CLI 中提供的任何内部构建工具。
现在我想在浏览器中运行我的构建,但是在特定的主机地址和端口下。例如:dev.someurl.com
和端口443
。
我尝试了 NPM 的服务包,但无法配置它的主机。它总是在本地主机上运行。
您对如何在特定主机和端口下运行 dist/bundle 有什么建议吗?
angular - 构建后Angular运行自定义插件
我正在尝试将async-css-plugin
(https://www.npmjs.com/package/async-css-plugin)添加到 Angular 项目中。这个插件的作用是,它将 html 文件中的外部样式链接标记转换为:
我知道我们可以扩展 webpack 配置,为此我正在使用ngx-build-plus
(https://github.com/manfredsteyer/ngx-build-plus)
我在下面的配置extend.webpack.config
文件中添加了:
但是现在当我运行时npm run build -- --prod --extra-webpack-config extend.webpack.config.js
,它不起作用。
它不会修改 index.html 文件。
如果我遗漏了什么,有人可以指导吗?
谢谢!
更新 这里是复制回购https://github.com/andreashuber69/async-css-angular-example
angular - 将自定义环境参数传递给 @angular-builders/custom-webpack
在我们的 Angular 9 应用程序中,我们在 angular.json 中配置了多个环境。
我们还使用@angular-builders/custom-webpack 添加一些自定义插件,这些插件需要一些基于环境的输入变量,但是如果我向环境节点添加自定义属性,我会收到此错误:
数据路径“”不应有其他属性(customPluginConfigForSandboxEnvironment)
有可能做这样的事情吗?
在 customWebpackConfig 文件中,我可以从选项中读取 outputPath
在这里保存我的额外配置,但如果可能的话,我更喜欢将所有配置保存到 angular.json 中。
谢谢
angular - 你如何使用 `@angular-devkit/build-angular` 延迟加载包
如何配置我angular.json
在运行时延迟加载 SDK+jQuery?
我目前有以下“正常”加载:
但是由于一个奇怪的依赖问题,我必须jquery
在我的index.html
我想做的是在我的构建中包含所有资产,但只有在用户尝试加入缩放会议时才加载和依赖项jquery
。zoomus-websdk.umd.min.js
我尝试了以下变体,但即使构建了捆绑包,sdk 仍然包含在原始页面加载中。
我什至不确定在哪里/何时明确zoomus-websdk.umd.min.js
添加到项目中,但我认为它来自package.json
angular - ng build 没有在 dist 文件夹中创建新的索引文件
我正在使用 Fuse 模板开始一个新项目。我以前没有问题地这样做过。这一次,当我从一个骨架应用程序开始时,我创建了一个新的组件和模块,它通过 ng serve 运行,没有任何问题。当我去构建和部署到 Firebase 托管时,我注意到虽然它在 /dist 中构建了一个 Fuse 文件夹,但在 /dist 中没有创建索引文件。关于为什么会发生这种情况的任何想法?
这是它的输出。
角度 JSON 文件
angular - 使用自定义 webpack 配置在 Angular 构建中将内联图像作为 base64
我有一个 Angular 项目,它只包含 web 组件。为了包含组件的资产(仅图像),我想使用自定义 webpack-config 来使用url-loader
或类似的东西将组件中使用的图像转换为内联 base64 图像。
我成功设置@angular-builders/custom-webpack
并验证它加载了我的webpack.config.js
. 经过大量试验和错误后,目前看起来像这样(但仍然无法正常工作):
我尝试只放置一个配置选项,因为它应该自动合并,但这不起作用,所以我编写了函数来真正覆盖默认的 Angular 图像加载器。
编辑:我发现我可以url-loader
从这样的代码中专门使用 webpack:
这种工作并且可能是解决这个问题的一种方法,因为它仅用于仅 Web 组件的项目中。但是,这在我的 .scss 文件中不起作用,我假设并且我更愿意找到一个解决方案,而不必记住库的特殊知识。
angular - css 中的 Angular 内联资源作为 data-uri
在 Angular 应用程序中是否有任何方法无需弹出 webpack 配置来拥有内联资源,如 CSS 背景属性中的 SVG?
我已经尝试过自定义 webpack 构建器来删除内置的文件加载器规则并添加 uri-loader,但是 SVG 没有内联。
我怀疑它可能与使用 postcss 的内部 SCSS/CSS 处理有关。
angular - 在 Angular 应用中动态加载另一个 Angular 应用
我目前正在寻找有关如何将单独的应用程序加载到其中的角度解决方案。就像是:
applicationA
将applicationB
在路线上加载/appb
并且也能够做到appb/subroute
。
这样做的最终目标是让多个团队可以分别开发多个应用程序,并且当发生更改时applicationA
,应用程序A调用的所有应用程序都不需要重新部署。
我正在看这篇文章,让我非常接近:https ://medium.com/angular-in-depth/building-extensible-dynamic-pluggable-enterprise-application-with-angular-aed8979faba5 。但是,我无法让它与子路由一起运行,并且构建在一组模块之上,而不是应用程序之上。
最后,来自 Manfred Steyer 的一篇文章,https: //www.angulararchitects.io/aktuelles/dynamic-module-federation-with-angular/ ,这是我真正想要的,但是,这是建立在“下一个”技术之上的那些尚未成熟的版本,既不是 Angular 版本,也不是它的路线图(我认为)。
问题:有没有人构建了这种解决方案,我可以从中得到一些指示?
angular - 如何修复Angular 11'选项“进度”已弃用'?
我在编译 Angular 11 时错过了百分比进度视图。通常我这样做:
ng serve
并在编译代码时看到了百分比的进步。现在,百分比视图已经消失,并且progress
已弃用:
不推荐使用“progress”选项:改用浏览器构建器中的“progress”选项。
现在的问题是:这是什么意思,或者我现在必须在哪里放置progress=true
选项才能取回百分比视图?