Yêu cầu thg 7 18, 2019 3:18 SA 955 0 1
  • 955 0 1
0

Cách config base link trong dự án vuejs, nuxtjs

Chia sẻ
  • 955 0 1

Anh chị cho em hỏi trong laravel khi khai báo base link trong blade thì em thường dùng config ( config('my.default_user_avatar') ) Vậy thì sang vuejs / nuxtjs thì config base link ở đâu là hợp lý nhất ạ? Rất mong được anh chị giúp đỡ, em xin cảm ơn ạ!

1 CÂU TRẢ LỜI


Đã trả lời thg 7 18, 2019 3:29 SA
Đã được chấp nhận
+5

Bạn sử dụng environment variable ý, kết hợp dotenv để có thể khai báo qua file .env như Laravel. Tất cả các environment variables sẽ được chứa trong biến global process.env. Khi solve một environemnt sẽ như sau:

process.env.BASE_URI.

Lúc này bạn có thể viết thêm một function javascript để render url cho tiện.

const url = (path = '') => `${BASE_URI}/${path}`

Ngoài ra:

  • Với Vue.js thuần thì bạn cần cài thêm EnvironmentPlugin cho webpack. https://webpack.js.org/plugins/environment-plugin/
  • Còn trong Nuxt.js thì nó đã config sẵn rồi, bạn chỉ cần thêm environment vào cho Nuxt.js app qua nuxt.config.js như sau thôi:
module.exports = {
  env: {
    BASE_URI: 'https://viblo.asia'
  }
}
Chia sẻ
Avatar Hoàng Anh @hoanganhdh
thg 7 18, 2019 4:21 SA

Em cảm ơn gợi ý của anh, em đã tìm hiểu và làm được rồi ạ!

thg 7 18, 2019 9:23 SA

You're welcome!

thg 7 19, 2019 8:03 SA

nếu là laravel và dùng mix để build mà muốn pass env qua js thì chỉ cần thêm prefix "MIX_" vào biến env muốn pass, số khác vẫn bt không sợ bị leak.

Mà tốt nhất là không dùng env cho những config làm gì, tạo thư mục config chứa các file config là js, json hay gì tùy bạn, 1 file index export function config. function này nhận string kiểu "something.some.thing" như laravel, và trả ra giá trị mong muốn là đc

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí