trevorpan
2 months ago
350
4
Vue

How to access index-name .env var with Algolia process.env.MIX_VUE_APP_INDEX_NAME;

Posted 2 months ago by trevorpan

Hi,

Have a frustratingundefined variable.

In the .env file:

MIX_VUE_APP_INDEX_NAME=testing_jobs

in the vue component:

<template>
    <div class="container">
        <ais-instant-search
            :search-client="searchClient"
           // index-name="{ indexName }" 
            :index-name="indexName" // have tried binding the var but still is undefined

        >
....


<script>
    import algoliasearch from 'algoliasearch/lite';
    import 'instantsearch.css/themes/algolia-min.css';

    let indexName = process.env.MIX_VUE_APP_INDEX_NAME;

    export default {
        data() {
            return {
                props: {
                    job: Object,
                    imageUrl: String,
                    // indexName: String // this did not work either, it expected string but got undefined
                },
                searchClient: algoliasearch(process.env.MIX_ALGOLIA_APP_ID, process.env.MIX_ALGOLIA_SEARCH),
                indexName: process.env.MIX_VUE_APP_INDEX_NAME
            }
        }
    };
    console.log(indexName);

I'm sure this is super easy, but I'm not sure why algoliasearch(process.env.MIX_ALGOLIA_APP_ID, process.env.MIX_ALGOLIA_SEARCH) works but not the indexName.

Thank you `

Please sign in or create an account to participate in this conversation.