Asked Jul 18th, 2019 3:18 AM 189 0 1
  • 189 0 1
0

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

Share
  • 189 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 ANSWERS


Answered Jul 18th, 2019 3:29 AM
Accepted
+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'
  }
}
Share
Hoàng Anh @hoanganhdh
Jul 18th, 2019 4:21 AM

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

+2
| Reply
Share
Jul 18th, 2019 9:23 AM

You're welcome!

0
| Reply
Share
Jul 19th, 2019 8:03 AM

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

+1
| Reply
Share