你好，我这边的图标一直出不来

[zjh129]

我使用你的填坑笔记能安装成功，但是图标这块还是有问题，Element-UI Icons能够正常显示，但是vue-element-admin自带的icons->svg图标无法显示，望指点。 laravel:5.8 node:v12.4.0 npm:6.9.0 laravel-mix:4.0.7

[zjh129]

关于bable 失败这块不用将babel.config.js复制到根目录，直接在webpack.mix.js中修改即可，如：

.babelConfig({
        plugins: ['dynamic-import-node'],
        presets: [
            '@vue/app'
        ]
    })

[osapis]

图标出不来,是因为你的webpack.mix.js里的fontLoaderConfig.exclude路径没写对 这样写： fontLoaderConfig.exclude = path.resolve(__dirname, 'resources/backend/icons/');

[Honvid]

我使用你的填坑笔记能安装成功，但是图标这块还是有问题，Element-UI Icons能够正常显示，但是vue-element-admin自带的icons->svg图标无法显示，望指点。 laravel:5.8 node:v12.4.0 npm:6.9.0 laravel-mix:4.0.7

现在是否已经解决？

可以贴一下 webpack.mix.js 的配置。

我的思路是：

• 先看配置的 exclude 路径是否正确，也包括

  rules: [
    {
      test: /\.svg$/,
      loader: 'svg-sprite-loader',
      include: [path.resolve(__dirname, 'resources/backend/icons/svg')],
      options: {
        symbolId: 'icon-[name]'
      }
    }
  ],

• 再看下 /path/to/your/project/node_modules/laravel-mix/src/builder/webpack-rules.js 中是否存在如下 rule:

test: /(\.(png|jpe?g|gif|webp)$|^((?!font).)*\.svg$)/,

如果不存在，则需要替换 webpack.mix.js 中 configReady 的规则为最新。

希望能够帮到你。

另外，@osapis 提到的方法可以尝试一下。

[zjh129]

非常感谢 @osapis 提供的解决办法，采用作者 @Honvid configReady配置对我来说是没有效果的。 感谢作者的细心整理，为laravel结合vue-element-admin开发后台提供了这么好方案，再次感谢！

[zjh129]

大神，图标问题解决了，但是打包后文件特别大，达到了15M+，加载也有点小卡，有没有分片方案呢？vue-element-admin说路由懒加载默认开启了，但迁移到laravel-mix下的时候无效。

[Honvid]

大神，图标问题解决了，但是打包后文件特别大，达到了15M+，加载也有点小卡，有没有分片方案呢？vue-element-admin说路由懒加载默认开启了，但迁移到laravel-mix下的时候无效。

好的。目前还没有时间进行优化，后面会进行排期。如果你有时间也可以提交修改。

PS: 对于后台项目的首屏加载速度一般没有特别强烈需求，前台页面一般会有。