天气插件（vue）和风天气插件

本来项目中用的中国天气，今天突然发现天气不显示了，突然报错net::ERR_SSL_VERSION_OR_CIPHER_MISMATCH 然后上中国天气管网去看，发现登陆都报错404了。。。

当时就一口老血。。。

后来翻了翻有采用了和两个样式差不多的和风天气，从两个人的管网体验和风就胜出了一大截。在使用上两者基本相同。

和风天气生成插件的自定义样式的网址   https://widget.qweather.com/

生成后的代码样式

<div id="he-plugin-simple"></div>
<script>
WIDGET = {
  "CONFIG": {
    "modules": "20134",
    "background": "5",
    "tmpColor": "17E6F5",
    "tmpSize": "30",
    "cityColor": "17E6F5",
    "citySize": "30",
    "aqiColor": "17E6F5",
    "aqiSize": "30",
    "weatherIconSize": "30",
    "alertIconSize": "18",
    "padding": "10px 10px 10px 10px",
    "shadow": "0",
    "language": "zh",
    "fixed": "false",
    "vertical": "center",
    "horizontal": "left",
    "key": "603e69a10d664df98f383cf538e0a913"
  }
}
</script>
<script src="https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0"></script>

其中script中的的代码打开是这样的https://widget.qweather.net/simple/static/js/he-simple-common.js?v=2.0

(function (d) {
  var c = d.createElement('link')
  c.rel = 'stylesheet'
  c.href = 'https://widget.heweather.net/simple/static/css/he-simple.css?v=1.4.0'
  var s = d.createElement('script')
  s.src = 'https://widget.heweather.net/simple/static/js/he-simple.js?v=1.4.0'
  var sn = d.getElementsByTagName('script')[0]
  sn.parentNode.insertBefore(c, sn)
  sn.parentNode.insertBefore(s, sn)
})(document)

在vue中使用

其中c.href、s.src两个文件我都下载下来放在本地进行加载了，经过 中国天气那一次我真的是怕了。因为vue打包后不打包static，assets，所以两个都放

  created(){
    //和风天气插件调用
    window.WIDGET = {
      "CONFIG": {
        "modules": "20134",
        "background": "5",
        "tmpColor": "17E6F5",
        "tmpSize": "30",
        "cityColor": "17E6F5",
        "citySize": "30",
        "aqiColor": "17E6F5",
        "aqiSize": "30",
        "weatherIconSize": "30",
        "alertIconSize": "18",
        "padding": "10px 10px 10px 10px",
        "shadow": "0",
        "language": "zh",
        "fixed": "false",
        "vertical": "center",
        "horizontal": "center",
        "key": "603e69a10d664df98f383cf538e0a913"
      }
    };
    (function (d) {
      var c = d.createElement('link')
      c.rel = 'stylesheet'
      c.href = '../../../static/css/he-simple.css'
      var s = d.createElement('script')
      s.src = '../../../static/js/he-simple.js'
      var sn = d.getElementsByTagName('script')[0]
      sn.parentNode.insertBefore(c, sn)
      sn.parentNode.insertBefore(s, sn)
    })(document)
  },