vue打包后404以及ElementUI打包后图标不显示问题

最新推荐文章于 2024-07-24 17:35:31 发布

原创最新推荐文章于 2024-07-24 17:35:31 发布 · 585 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#elementui #vue.js #javascript

本文介绍了在Vue项目打包过程中遇到的404错误和ElementUI图标不显示的问题，问题根源在于路径配置。通过修改config.index.js中的assetsPublicPath为'./'以及在build.utils.js中针对extractTextPlugin的publicPath设置为'../../'，成功解决了这两个问题，确保了项目在打包后能正常运行和显示图标。

1.vue打包404

config中index.js文件的build中的assetsPublicPath: '/',改为assetsPublicPath: './',

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',
    //打包后正常运行
}

2.引入ElementUI打包后小图标不显示

build中until.js文件中if (options.extract)判断下加入publicPath:'../../'

if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
		publicPath:'../../',
	    // 打包后elementui显示图标	
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }

总结：都是路径问题。

关注博主即可阅读全文