Revision history [back]

To set up Nuxt 2.8 to produce code that is compatible with ES5, you need to follow these steps:

1. Install the @nuxtjs/eslint-config package as a development dependency by running the following command in your terminal:

   npm install --save-dev @nuxtjs/eslint-config
   

2. Create a .eslintrc.js file in your project directory with the following content:

   module.exports = {
    extends: [
      '@nuxtjs',
      'eslint:recommended',
      'plugin:vue/recommended',
      'prettier',
      'prettier/vue',
    ],
    rules: {
      'vue/no-v-html': 'off',
    },
   }
   

   This configures ESLint to use the Nuxt.js recommended config and Prettier formatting.

3. Add a Babel configuration by creating a .babelrc file with the following content:

   {
    "presets": [
      [
        "@babel/preset-env",
        {
          "targets": {
            "ie": "11",
            "chrome": "58",
            "safari": "10",
            "firefox": "54",
            "edge": "14"
          },
          "useBuiltIns": "usage",
          "corejs": "3.6.5"
        }
      ]
    ]
   }
   

   This tells Babel to target a specific set of browsers and to use the usage option for the core-js polyfills.

4. Finally, update your nuxt.config.js file to include the @nuxtjs/eslint-config module:

   export default {
    buildModules: [
      '@nuxtjs/eslint-config'
    ],
    build: {
      babel: {
        presets({ isServer }) {
          const targets = isServer ? { node: 'current' } : { ie: '11' }
          return [
            [
              '@nuxt/babel-preset-app',
              {
                loose: true,
                targets,
              },
            ],
          ]
        },
      },
    },
    // ...
   }
   

   This configures your project to use the @nuxtjs/eslint-config module during the build process.

With these changes, you should be able to produce code that is compatible with ES5 when using Nuxt.js 2.8.