vue-browserify import yaml file as javascript object vuejs2

After spend a lot of time on various forum i found a solution

1) Directly import like a json file. So I don't have to provide yaml file in production:

First install yamlify

npm install --save-dev yamlify

Then add yamlify to browserify transform

"browserify": {    "transform": [      "babelify",      "vueify",      "yamlify"    ]  },

And finaly import your YAML as a classic json file (in main.js for example)

import Data from '../static/example-data.yml'

2) Import from external url

First install yamljs

npm install --save-dev yamljs

And then you can get external file data like that

import YAML from 'yamljs'const ExternalData = YAML.load('http://localhost:8080/static/example-data.yml')console.log(ExternalData)

3) Convert YML to JSON on saveFirst install yamljs

npm install --save-dev yamljs

Then update scripts on package.json (add yml2json and update watchify)

"scripts": {    "watchify": "watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js | npm run yaml2json",    "yaml2json": "yaml2json static -r -s -w",    "serve": "http-server -o -c 1 -a localhost",    "dev": "npm-run-all --parallel watchify serve",    "lint": "eslint --ext .js,.vue src",    "build": "cross-env NODE_ENV=production browserify -g envify -p [ vueify/plugins/extract-css -o dist/build.css ] -e src/main.js | uglifyjs -c warnings=false -m > dist/build.js"  },