快上网专注成都网站设计 成都网站制作 成都网站建设
成都网站建设公司服务热线:028-86922220

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

vue-cli3.0如何使用CDN区分开发、生产、预发布环境-创新互联

前言:上一篇记录文vue-cli 3.0 build包太大导致首屏过长的解决方案中提到了CDN优化,之前是直接在html中手动注入JS,也没有对开发和生产模式进行区分,因为是使用收费的CDN,所以在开发模式会遇到无权使用CDN的问题。要是使用CDN写死在html中,不同环境需要手动的切换CDN,那么早晚有一天会搞乱,下面就说说怎么在vue-cli 3.0 中根据不同环境动态注入CDN。

成都创新互联公司成立于2013年,是专业互联网技术服务公司,拥有项目网站设计制作、成都网站设计网站策划,项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命,1280元文圣做网站,已为上家服务,为文圣各地企业和个人服务,联系电话:13518219792

1. 修改public/index.html


通过htmlwebpackplugin动态注入脚本和样式,index.html如下:



 
  
  
  
  
  杭州纳舍科技
  
  <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
   
   
  <% } %>
  
  <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
   
  <% } %>
 
 
  
  
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %> <% } %>

当前文章:vue-cli3.0如何使用CDN区分开发、生产、预发布环境-创新互联
转载来源:http://6mz.cn/article/hshdd.html

其他资讯