Vueでグローバル定数ファイルを定義するベストプラクティスが議論されていたのでメモ

stackoverflow.com

自分は上記記事を参考にして以下のようにしました 。
外部から変更できない変数を宣言してexport し、使う側でimport する方法です。
constフォルダ等(定数と分かるフォルダ名)を用意して各定数ファイルを用意すると、一目で定数ファイルと分かるので混乱しないと思います。

const.js

// Object.freezeを使用しないと外部で値を書き換えることが出来る
// Object.freezeはネストしたオブジェクトまで見ないので、Objectの中でObjectを宣言する場合、宣言するObjectにもObject.freezeをつける
export default Object.freeze({
  VALUE: 1
});

Vue

<script>
import config from 'path/to/const'
...
mounted() {
  console.log(config.VALUE) // 1
  // config.VALUE = 2 はエラーになる
},