博客

记录hue4.1.0引进vue.js、axios.js、browser.js等

由于业务需要引进vue.js、axios.js来修改hue，在这里记录一下hue引进vue.js等js的方法。

步骤：

1. 首先下载vue，
   
   下载地址
   
2. 将下载到本地的vue.js放在目录
   
desktop/core/src/desktop/static/desktop/js/

   下。
3. 在
   
desktop/core/src/desktop/templates/hue.mako

   文件添加代码：

  // Add modified URL for .clearable background
  var originalClearableImgUrl = '${ static('desktop/art/clearField@2x.png') }';
  var clearableImgUrl = typeof adaptHueEmbeddedUrls !== 'undefined' ? adaptHueEmbeddedUrls(originalClearableImgUrl) : originalClearableImgUrl;
  document.styleSheets[0].insertRule('.clearable { background: url(' + clearableImgUrl + ') no-repeat right -10px center; }');
% endif
  </script>

  ${ commonHeaderFooterComponents.header_i18n_redirection() }

  <script src="/desktop/globalJsConstants.js?v=${ hue_version() }"></script>

  % if not conf.DEV.get():
  <script src="${ static('desktop/js/hue.errorcatcher.js') }"></script>
  % endif
  <script src="${ static('desktop/js/hue4.utils.js') }"></script>
  ## 在这里引入vue.js和其他js，位置大概在120行处
  <script src="${ static('desktop/js/vue-2.5.3.js') }"></script> 
  <script src="${ static('desktop/js/axios.min.js') }"></script>
  <script src="${ static('desktop/js/browser.min.js') }"></script>
</head>

其他的axios.js

下载地址

和browser.js

下载地址

也是用同样的方法引入。