zoukankan      html  css  js  c++  java
  • vue-cli3构建的项目打包部署在非根目录下的服务器时需要进行的配置

    vue-cli3直接打包项目时,部署到服务器。会出现,css,js文件加载失败,链接错误的问题。这个时候要修改config文件夹下的index.js文件

      build: {
        // Template for index.html
        index: path.resolve(__dirname, '../dist/index.html'),
    
        // Paths
        assetsRoot: path.resolve(__dirname, '../dist'),
        assetsSubDirectory: 'static',
        assetsPublicPath: './',
    }
    

      assetsPublicPath: '/'改为assetsPublicPath: './'

    之后还可能会出现css样式的背景图片加载失败,链接错误的问题。这个时候需要修改build文件夹下的webpack.prod.conf.js和utils.js

     output: {
        publicPath: './',
        path: config.build.assetsRoot,
        filename: utils.assetsPath('js/[name].[chunkhash].js'),
        chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
      },
    

      output中多加个publicPath: './',

    if (options.extract) {
          return ExtractTextPlugin.extract({
            use: loaders,
            fallback: 'vue-style-loader',
            publicPath:'../../'
          })
        } else {
          return ['vue-style-loader'].concat(loaders)
     }
    

      这个位置也需要加个publicPath:'../../'。之后再进行打包部署就不会有问题了

  • 相关阅读:
    Linux文件权限管理
    Linux用户权限管理
    压缩,解压缩 和tar详细介绍
    grep基本详细使用
    Vim文本编辑器详细用法
    Linux命令查找文件目录
    Linux文件增删改
    Linux目录管理
    Linux修改主机名
    Linux创建高级用户并删除
  • 原文地址:https://www.cnblogs.com/sisxxw/p/15480376.html
Copyright © 2011-2022 走看看