vue-cli webpack配置cdn路径 以及 上线之后的字体文件跨域处理

发布时间:2019-05-28 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了vue-cli webpack配置cdn路径 以及 上线之后的字体文件跨域处理脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

昨天搞了一下vue项目打包之后静态资源走阿里云cdn。

配置了半天,终于找到了设置的地方

config/index.js 里面设置build 下的 assetsPublicPath 打包的时候便可以添加公共前缀路径

assetsSubDirectory: 'admin/static',  // 生成的文件目录
assetsPublicPath: 'https://cdn.xxxxx.com', // 添加路径前缀

这样就可以修改掉打包的静态资源的地址了,没有修改之前打包完为 admin/static
修改之后为 https://cdn.xxxxx.com/admin/s...

上线之后发现字体文件改用cdn会有跨域问题,nginx设置也可以。但是我这里是把字体单独处理了

在loader里面 webpack.base.conf.js

{
    test: /.(woff2?|eot|ttf|otf)(?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
            name: utils.assetsPath('fonts/[name].[hash:7].[ext]'),
            publicPath: '/admin/static'
    }
}

这样,打包出来的除了字体文件是按照文件路径的,其他的都会是cdn路径

脚本宝典总结

以上是脚本宝典为你收集整理的vue-cli webpack配置cdn路径 以及 上线之后的字体文件跨域处理全部内容,希望文章能够帮你解决vue-cli webpack配置cdn路径 以及 上线之后的字体文件跨域处理所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:Vue