vue-cli 3 webpack設定yaml讀取

目前已經將原本在框架下使用json設定檔案都改成yaml檔案
畢竟yml的結構比json要好上很多
在後端的nodejs上透過js-yaml即可讀取
前端上vue要使用
則需要透過webpack的js-yaml-loader的設定支援讀取
使用上可以很簡單的用
import data from 'js-yaml-loader!./conf/apis.yml'
這樣免設定的方式執行 但還是不太建議直接這樣用

如果是要設定到webpack的config上
使用vue-cli 3 會發現已經完全看不到webpack的設定
所有的設定已經都包裹在整個架構內
如果需要調整或增加webpack設定
可以在根目錄下建立vue.config.js檔案
用來覆寫或增加上定內容

參考vue-cli設定
https://cli.vuejs.org/guide/webpack.html#simple-configuration

以下sample code範例為
修改連線port 並加入yaml loader

module.exports = {
  devServer: {
    port: 1234
  },
  chainWebpack: config => {
    config.module
      .rule('yaml')
      .test(/\.ya?ml$/)
      .use('js-yaml-loader')
      .loader('js-yaml-loader')
      .end()
  }
}