const pkg = require('./package')

module.exports = {
  mode: 'universal',

  server: {
    port: 3003,
    host: '0.0.0.0'
  },
  /*
  ** Headers of the page
  */
  head: {
    title: pkg.name,
    titleTemplate: 'Marc Leopold | %s',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },

      { hid: 'description', name: 'description', content: 'Photographer, Marc Leopold has images in numerous collections and publications. Here is a glimpse of his work, an insight into his philosophy and motivations.' },

      { property: 'og:image', content: 'XXXXXXXXXXX'},
      { property: 'og:image:width', content: 'XXXXXXXXXXX'},
      { property: 'og:image:height', content: 'XXXXXXXXXXX'},
      { property: 'og:title', content: 'Marc Leopold Photography' },
      { property: 'og:url', content: 'https://marcleopold.isnet.uk' },
      { property: 'og:site_name', content: 'Marc Leopold Photography' },
      { property: 'og:type', content: 'website'},
      { property: 'og:description', content: 'Marc Leopold is a Chicago born photographer whose images have appeared in many collections and publications. His website is a showcase of his outstanding work and an insight into his philosophy and motivations.' },
      { name: 'twitter:card', content: 'summary' },
      { name: 'twitter:title', content: 'Marc Leopold Photography' },
      { name: 'twitter:image', content: 'XXXXXXXXXXX' },
      { name: 'twitter:image:alt', content: 'The website of Marc Leopold Photography.' },
      { name: 'twitter:creator', content: '@studiovxweb' },
    ],
    link: [
      { rel: 'icon', type: 'image/png', sizes: '16x16', href: '/favicon-16x16.png' },
      { rel: 'icon', type: 'image/png', sizes: '32x32', href: '/favicon-32x32.png' },
      { rel: 'icon', type: 'image/png', sizes: '96x96', href: '/favicon-96x96.png' },
      { rel: 'stylesheet',
        href: 'https://fonts.googleapis.com/css?family=' +
              'Montserrat:400,600|' +
              'Raleway:400,600|' +
              'Satisfy'
      },
    ]
  },

  /*
  ** Customize the progress-bar color
  */
  loading: {
    color: '#fff',
    height: '1px',
  },

  /*
  ** Global CSS
  */
  css: [
    '@/assets/scss/style.scss'
  ],

  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
    { src: '~/plugins/Vuelidate' }
  ],

  /*
  ** Nuxt.js modules
  */
  modules: [
    // Doc: https://github.com/nuxt-community/axios-module#usage
    '@nuxtjs/axios',
    // Doc: https://buefy.github.io/#/documentation
    'nuxt-buefy',
    [
      'nuxt-sass-resources-loader',
      [
        '@/assets/scss/_globals.scss'
      ]
    ]

  ],
  /*
  ** Axios module configuration
  */
  axios: {
    // See https://github.com/nuxt-community/axios-module#options
  },

  /*
  ** Build configuration
  */
  build: {
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {
      // vue-svg-loader
      const svgRule = config.module.rules.find(rule => rule.test.test('.svg'))
      svgRule.test = /\.(png|jpe?g|gif|webp)$/
      config.module.rules.push({
        test: /\.svg$/,
        loader: 'vue-svg-loader',
      })

      // Run ESLint on save
      if (ctx.isDev && ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        })
      }
    }
  }
}