最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Angular import attributes with Webpack do not work - Stack Overflow

programmeradmin2浏览0评论

I can use import attributes when using Agnular @angular-builders/custom-esbuild:application builder like this:

import userImage from 'img/icons/user.svg' with { loader: 'file' };

This perfectly works and I see there's a plugin from Angular team specifically for this situation. But when I try to do the same with @angular-builders/custom-webpack:browser I got an error:

./src/app/assets.ts:7:48 - Error: Module parse failed: Unexpected token (7:48)
File was processed with these loaders:
 * ./node_modules/@angular-devkit/build-angular/src/tools/babel/webpack-loader.js
 * ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js
You may need an additional loader to handle the result of these loaders.
| // These images are used inside img tags, so they're loaded with file-loader
| // instead of svg-inline-loader
> import userImage from 'img/icons/user.svg' with loader: 'file';

I don't see why it can't work as webpack support import attributes. My Webpack config for reference:

            {
                test: /\.svg$/,
                oneOf: [
                    {
                        // SVG images as files
                        with: { loader: 'file' },
                        type: 'asset/resource',
                    },
                    {
                        // SVG images inlined
                        type: 'asset/source',
                    }
                ]
            },
发布评论

评论列表(0)

  1. 暂无评论