📝 add vue-cli5 solutions of "After the micro-app is bundled, the font files and images in the css load 404" (#2485)

This commit is contained in:
HJM515 2023-05-07 17:36:25 +08:00 committed by GitHub
parent b2b5d95e2a
commit bf01881c97
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 0 deletions

View File

@ -320,6 +320,17 @@ module.exports = {
};
```
`vue-cli5` project, use the `asset/inline` of `webpack` replace `url-loader`:
```js
module.exports = {
chainWebpack: (config) => {
config.module.rule('fonts').type('asset/inline').set('generator', {});
config.module.rule('images').type('asset/inline').set('generator', {});
},
};
```
3. Use the `file-loader` of `webpack` to inject the full path when packaging it (suitable for projects with large font files and images)
```js

View File

@ -322,6 +322,17 @@ module.exports = {
};
```
`vue-cli5` 项目,使用 `asset/inline` 替代 `url-loader`,写法:
```js
module.exports = {
chainWebpack: (config) => {
config.module.rule('fonts').type('asset/inline').set('generator', {});
config.module.rule('images').type('asset/inline').set('generator', {});
},
};
```
3. 借助 `webpack``file-loader` ,在打包时给其注入完整路径(适用于字体文件和图片体积比较大的项目)
```js