vue-element-admin里面使用npm run build:prod打包步骤

简介: vue-element-admin里面使用npm run build:prod打包步骤

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查看一下这是为啥,会发现这些文件的路径访问不到

解决办法

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

打开vue.config.js文件

打开

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

注释掉

//publicPath: './',

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

相关文章
|
1月前
|
JSON JavaScript 数据格式
NPM 发包 js 文件并支持 ts 使用(包含 gulp 打包压缩)
NPM 发包 js 文件并支持 ts 使用(包含 gulp 打包压缩)
85 0
|
1月前
|
JavaScript
npm install没问题,但npm run dev的时候报Node Sass version 6.0.1 is incompatible with ^4.0.0 ^5.0.0
npm install没问题,但npm run dev的时候报Node Sass version 6.0.1 is incompatible with ^4.0.0 ^5.0.0
24 0
|
1月前
项目打包报错“caniuse-lite is outdated. Please run next command `npm update`”的解决方案
项目打包报错“caniuse-lite is outdated. Please run next command `npm update`”的解决方案
83 1
|
1月前
|
弹性计算 Dubbo Serverless
Serverless 应用引擎操作报错合集之阿里函数计算中配置完fc,出现‘Function instance exited unexpectedly(code 1, message:operation not permitted) with start command 'npm run start '. 报错如何解决
Serverless 应用引擎(SAE)是阿里云提供的Serverless PaaS平台,支持Spring Cloud、Dubbo、HSF等主流微服务框架,简化应用的部署、运维和弹性伸缩。在使用SAE过程中,可能会遇到各种操作报错。以下是一些常见的报错情况及其可能的原因和解决方法。
|
1月前
|
JavaScript 开发者 资源调度
Spartacus 2211 开发版本采用 npm install 结合 package-lock.json 避免 build 出错
Spartacus 2211 开发版本采用 npm install 结合 package-lock.json 避免 build 出错
Spartacus 2211 开发版本采用 npm install 结合 package-lock.json 避免 build 出错
|
1月前
|
域名解析 JavaScript 前端开发
【面试题】三面 面试官:运行 npm run xxx 的时候发生了什么?
【面试题】三面 面试官:运行 npm run xxx 的时候发生了什么?
|
1月前
|
JSON JavaScript Unix
Nodejs 第五章(Npm run 原理)
Nodejs 第五章(Npm run 原理)
46 0
|
1月前
|
JavaScript
npm run build ERROR in static_js_vendor.e475838be75c71f87b37.js from UglifyJs
npm run build ERROR in static_js_vendor.e475838be75c71f87b37.js from UglifyJs
62 0
|
1月前
|
网络安全 计算机视觉
【node】 npm install 报错:code 128
【node】 npm install 报错:code 128
62 1
|
1月前
|
JavaScript Linux 数据安全/隐私保护
node内网安装npm私服以及依赖包上传发布verdaccio
node内网安装npm私服以及依赖包上传发布verdaccio
223 1