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

2024年5月14日 353次阅读 来源: 一叶知秋

昨天搞了一下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路径

    原文作者：一叶知秋
    原文地址: https://segmentfault.com/a/1190000017333733
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞