vue-cli 打包后,无需重新打包修改ip方法

最新推荐文章于 2023-06-18 21:02:16 发布
最新推荐文章于 2023-06-18 21:02:16 发布
阅读量726 收藏
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014586621/article/details/116534156
版权

需求:打包后js文件被压缩,部署时拿到的打包后代码,上线前需要在单独文件修改压缩后代码的ip

方法:index 引入 配置ip的js文件,作为变量传递给 baseUrl ,实现一处修改,刷新就用

小m的雨季
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 不同环境打包配置不同命令与IP
a576837179的博客
12-27 503
1、什么是cross-env? 它是运行跨平台设置和使用Node中环境变量的组件。 2、为什么需要cross-env? 【 cross-env 能够提供一个设置环境变量的scripts】 自定义配置环境变量在不同的环境下，配置方式也是不同的。根据本地、测试、线上环境配置不同的API。 npm install cross-env --save-dev config->dev.env.js文件 module.exports=merge(prodEnv,{ NODE_ENV:development, ENV
vue-cli3项目打包后自动化部署到服务器的方法
10-14
这里我们将详细讲解如何使用 Vue CLI 3 实现项目的自动化打包与部署。 首先，确保你的项目已经使用 Vue CLI 3 创建，并且配置好相关的构建设置。Vue CLI 3 的打包命令通常是 `npm run build`，它会生成一个 `dist` ...
vue 项目打包之后进行修改配置后端 IP 地址、端口等信息方法
CSDN_33901573的博客
05-11 8571
用vue-cli构建的项目通常是采用前后端分离的开发模式，也就是前端与后台完全分离，此时就需要将后台接口地址打包进项目中，但是，我们只是改个接口地址也要重新打包那就太麻烦了。怎么解决呢？方法如下，本文推荐俩种方式。
修改Vue项目运行的IP和端口
见证自己学习,成长的记录
02-09 7040
我们在使用VsCode启动Vue项目的时候，我发现：默认的端口号好像和tomcat一样，默认都是8080，如果8080被占用了，就会使用8081,8082这样的方式以此类推。那么，我们是否可以像后端一样，通过修改port属性的方式达到修改运行端口的方式呢？其实还是很简单的。这个vue.config.js和springboot的application配置文件是一个道理，需要修改项目什么东西就直接在里面改。注意语法就好啦！以后遇到其他的配置语法，会持续更新！
vue开发环境和生产环境配置不同的路由，打包不用手动改ip
aliven1的博客
04-16 3355
如果部署的ip固定，也就是固定的服务器，下面配置一次，生产和开发环境就不用改动ip:打包的时候确定该使用哪个ip 1.在src中创建api/api.js文件 在api的中读取打包时node中的的全局表量，看node打包是开发打包还是生产打包：let root=process.env.NODE_ENV; 2.如果是开发环境，root获得的环境变量，和dev.env.js中的NODE_ENV...
Vue-cli项目无法使用ip访问
素钗一生推
08-01 772
如题： 可能原因如下： 1.缺少host参数 修改为如下即可 "scripts": { "dev": "webpack-dev-server --inline --progress --host 0.0.0.0 --config build/webpack.dev.conf.js", ... } 2.开启了一些透过ip实现翻墙的某些第三方软件，关闭即可...
Vue通过配置文件更改打包后工程的url请求服务地址（避免重复打包）
weixin_44134588的博客
08-25 4646
代码开发的过程中分为生产环境和开发环境，生产环境是部署上线后的环境，而开发环境就是代码开发阶段所使用的环境，很多服务都是本地的； 需求： 代码打包之后，后端服务地址有变动，不想重新打包，能否通过修改某些文件的方式来进行修改？ 解决方案： 在根目录下新建一个config.js文件，里面的信息就是生产环境的地址信息： 然后在index文件中引入该js文件 此时 ，在我们项目中的js代码中就能够直接拿到config文件内的信息了，也就是dataUrl这个对象； 紧接着，在自己封装api时，一般会判断是生产环
vue2的打包事项（publicPath路径），部署在域名子路径上
insist_life的博客
06-18 4593
/ 例如 https://www.ruoyi.vip/。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions。// http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件。$/i, // 压缩文件格式。
vue打包部署之后，引入的ip地址可以修改，无需再次打包(vue2)
weixin_43787161的博客
02-21 1191
vue打包部署之后，引入的ip地址可以修改，无需再次打包(vue2)
解决vue cli使用typescript后打包巨慢的问题
12-13
之前使用过 ts-loader 打包 react 项目，给我的感觉就是巨慢，开发环境下，每次保存后，需要等10秒钟左右才能构建完成，当时为了解决这个问题，把 ts-loader 替换成了 babel 的 typescript 插件，结果是非常的快，...
vue-cli脚手架打包静态资源请求出错的原因与解决
12-02
修改后，重新打包并部署，应该可以正常访问 CSS 和 JS 文件。 然而，问题并未完全解决。在 CSS 文件中引用的图片资源（如背景图）也可能出现类似的问题。通常，我们会在 CSS 中写入如 `background: url('static/img...
如何修改Vue打包后文件的接口地址配置的方法
10-15
主要介绍了如何修改Vue打包后文件的接口地址配置的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue项目打包后直接修改ip地址
weixin_35757191的博客
01-09 2009
在 Vue 项目的配置文件中可以设置 devServer.host 属性来指定开发服务器的主机名。打包后的项目文件中并不包含该配置，所以需要使用其他方式来修改 IP 地址。 一种方法是在本地的 hosts 文件中添加一条映射记录，将域名映射到所需的 IP 地址上。例如，将 localhost 映射到 192.168.1.100： 192.168.1.100 localhost 然后在 Vue 项...
vue打包后的项目动态修改服务器地址，无需重新打包
weixin_43870864的博客
06-24 2132
这个问题很好实现，但是在纠结一个问题，vue打包分环境npm run dev/npm run stage…那怎么实现使用不同的命令打完的包只改配置文件就可以生效？ 目前采用的方式是：npm run stage打包，那打包后的环境就是staging，判断是staging的时候就读取配置文件 1. 在public下创建config.js文件 **2. 在public/index.html中引入 ** 3. 在使用的地方时候，我是在main.js中全局方法挂载了下 **4. 在具体使用的地方需要调用con
Vue打包成dist文件后修改ip地址方法
alo_ne的博客
08-04 4694
为了方便把代码发给别人去部署 所以需要进行修改相应 的ip地址 此时就需要给出配置接口去修改 步骤一： 在public中创建一个config.js文件 之后引入所有可能改变的代码 放在windows下 步骤二： 在index.html中引入 script标签引入 步骤三： 可以直接使用了 特别提醒：如果是放在dom中直接使用 不可以直接这么写 需要在脚本中引用 ...
vue-cli --动态配置Ip地址，而不需要每次都打包
weixin_33895475的博客
07-23 2776
思路： 1.在不参与打包的文件外新建一个ipConfig.js，然后在index内引入其中的参数。 - ipconfig.js //ip配置参数 const IPCONFIG = 'http://111.231.75.122/'; 复制代码index.js <!DOCTYPE html> <html> <head> <meta chars...
使用vue-cli打包过程中的步骤以及问题
热门推荐
martsforever的博客
12-21 1万+
1、打包命令是npm run build，这个命令实际上是在package.json中，scripts中build所对应的命令； 2、创建一个prod.server.js，这个文件不是必须的，这个文件的用处是在打包完毕之后，通过启动node.js本地服务来访问打包完成的静态文件，不需要的同学可以忽略这一点， prod.server.js文件代码示例： let express...
vue-element-admin 菜单栏 三级目录生成无法展示问题
09-16 2639
子菜单父级要带<router-view /> 这样 vuex才有容器去展示 子菜单的内容 index.vue: <!-- 父级路由组件 --> <template> <div> <!-- xxx html 内容 --> <router-view /> </div> </template> https://panjiachen.github.io/vue-element-
vue打包文件名修改
最新发布
08-02
根据提供的引用内容，可以看出修改Vue打包文件名的步骤如下： 1. 在项目根目录下创建.env.development和.env.production文件，分别用于开发环境和生产环境的配置。 2. 在.env.development文件中，设置VUE_APP_NAME为开发环境的打包文件名，设置VUE_APP_URL为开发环境的请求地址。 3. 在.env.production文件中，设置VUE_APP_NAME为生产环境的打包文件名，设置VUE_APP_URL为生产环境的请求地址。 4. 在request.js文件中，使用process.env.VUE_APP_URL来设置Axios的baseURL，以便根据环境变量来动态设置请求地址。 5. 在package.json文件的scripts对象中配置不同的打包命令，根据不同的mode来选择不同的打包环境。 6. 在Vue.config.js文件中，根据环境变量VUE_APP_NAME来设置打包文件名。 7. 运行相应的命令来启动服务或进行打包，根据需要选择不同的环境和打包命令。 请注意，如果修改了.env配置文件，需要重新启动服务或下载插件进行监听才能生效。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值