What is the process for setting up Nuxt 2.8 to produce code that is compatible with ES5?

edit

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.