about uscontact

How to set prefix or suffix to title in NuxtJS

Author: zemna
Date: April 17, 2021
Share this:

Create .env file and add APP_NAME variable


Add global environment variable to nuxt.config.js

You can use your custom variable name. I'm using appName for this demo.

export default {
  // Insert this option
  env: {
    appName: process.env.APP_NAME || 'ZEMNA.NET'

After set, we can use this variable using process.env.appName.

Set default header in nuxt.config.js

In nuxt.config.js file, You can't access your process.env.appName environment variable.

So we will use process.env.APP_NAME from .env file.

export default {
  head: {
    title: process.env.APP_NAME,

Set header in vue file

export default {
  head() {
    return {
      title: 'My article page title' + ' - ' + process.env.appName
Share this:

Leave a Reply

Your email address will not be published.


Professional software development agency estalished in Indonesia. We offers website setup, web application development, fulfillment service, and etc.
Follow us
Follow us to get latest news and tutorials.
2022 - Copyright, All Rights Reserved, Made by ZEMNA.NET with ❤️