美文网首页
vue-element-admin里面使用npm run bui

vue-element-admin里面使用npm run bui

作者: 祈澈菇凉 | 来源:发表于2021-07-15 14:58 被阅读0次

    1:打开.env.development
    将接口地址设置成线上访问
    注释本地
    VUE_APP_BASE_API = '/'

    ENV = 'development'
    
    # 接口地址
    VUE_APP_BASE_API  = '/'
    #VUE_APP_WS_API = 'http://192.168.4.103:8091/'
    
    # 是否启用 babel-plugin-dynamic-import-node插件
    VUE_CLI_BABEL_TRANSPILE_MODULES = true
    
    

    2:打开.env.local文件和.env.production文件
    同上

    3:打开vue.config.js
    注释掉proxy
    proxy代理在打包的时候需要注释,平时开发需要开着

      //打包的时候需要注释
        //平时开发需要开着
        // proxy: {
        //   '/api': {
        //     target: process.env.VUE_APP_BASE_API,
        //     changeOrigin: true,
        //     pathRewrite: {
        //       '^/api': 'api'
        //     }
        //   },
        //   '/check': {
        //     target: process.env.VUE_APP_BASE_API,
        //     changeOrigin: true,
        //     pathRewrite: {
        //       '^/check': 'check'
        //     }
        //   }
        // }
    

    4:关于使用npm run build:prod命令进行打包后白屏的问题

    会出现这样的情况生成了一个静态的文件夹打开index.html的时候,会出现页面空白的问题,打开F12查看一下这是为啥,会发现这些文件的路径访问不到


    图片.png

    解决办法

    需要打开routers.js文件,路由模式将histroy改成hash模式,起初 mode:'history'

    打开vue.config.js文件
    打开

    // hash 模式下可使用
      publicPath: process.env.NODE_ENV === 'development' ? '/' : './',
    

    注释掉

     //publicPath: './',
    

    5:重新执行命令,npm run build:prod,即可

    相关文章

      网友评论

          本文标题:vue-element-admin里面使用npm run bui

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