美文网首页
[vue]--npm run build 打包问题

[vue]--npm run build 打包问题

作者: miniy_7 | 来源:发表于2019-09-29 09:51 被阅读0次

打包路径问题

默认打包路径是直接在根目录dist下进行打包,增加项目名部署会照成404 问题

  • 修改 /config/index.js 下build 对象assetsPublicPath值‘./’:
 build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',
  ...

图片文件过大,打包后404问题

npm 打包会生成static文件夹,一般static文件夹是比较干净的,只有css与js两个文件夹存在。如果打包后生成img或者其他文件夹时,说明文件过大,无法打包进入,webpack 默认10k。

  • 修改webpack 设置,/build/webpack.base.conf.js
     {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 1000000,  // 增大设置
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
        }
      },
      {
        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 1000000,// 增大设置
          name: utils.assetsPath('media/[name].[hash:7].[ext]')
        }
      },
      {
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 1000000,// 增大设置
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        }
      }

相关文章

网友评论

      本文标题:[vue]--npm run build 打包问题

      本文链接:https://www.haomeiwen.com/subject/jqnxuctx.html