[Vuejs]-How to pass Laravel env data to Vue component

by

1👍

✅

You need to remove the quotes. Webpack will interpolate the value for you:

<template>
{{ stripe }} // Renders process.env.MIX_STRIPE_KEY (Not the actual key?)
...code
</template>
<script>
export default {
    data: function() {
        return {
            stripe: Stripe(process.env.MIX_STRIPE_KEY),
...

Will compile as:

<template>
{{ stripe }} // Renders process.env.MIX_STRIPE_KEY (Not the actual key?)
...code
</template>
<script>
export default {
    data: function() {
        return {
            stripe: Stripe("pk_test_xxxxxxxxxxxxxxxxxx"),
...
👤Eric Tucker

0👍

Note for future readers: do not place your STRIPE_SECRET into Mix as this may make it exposed to the browser and any user that decides to snoop in it.

👤Flipper

Leave a comment