Fix missing semicolon on imported json module

Fix Missing Semicolon on require('./en.json') module

webpack / vue config file:

module: {
  rules: [
    // loader for js file
    {
      test: /\.js/,
      use: [
        {
          loader: 'thread-loader'
        },
        {
          loader: 'cache-loader'
        },
        {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'],
            plugins: [
              '@babel/plugin-transform-modules-umd',
              '@babel/plugin-transform-runtime',
              '@babel/plugin-transform-regenerator',
              '@babel/plugin-transform-object-assign'
            ]
          }
        },
        {
          loader: 'eslint-loader',
          options: {
            fix: true
          }
        }
      ]
    },

quick fix error

// modify test rule:
  test: /\.js/ ====> test: /\.js$/

why ?

/\.js/.test('a.json') // true
/\.js$/.test('a.json') // false

// error will fix

在js代码中，require()引入了json文件，突然就报错： eslint error: Missing semicolon.

json的内容是非常普通的数据，就是引入了多语言、国际化的json文件

const i18n = new VueI18n({
  messages: {
    zh: require("./zh.json"),
    en: require("./en.json")
  }
});

看到报错后，感觉到莫名其妙，json文件为什么会要求加分号呢？

查了10分钟，才发现是 webpack loader 的配置出错了。

json文件使用了 js loader 来处理，肯定会报错的啊，json的语法跟js完全是不同的，使用 js loader来处理json肯定是出问题

公司的vue项目的脚手架是别的同事做的，出现了这种坑人的配置。vue 官方脚手架应该是没有此类问题的。

问题总算是解决了。

// 错误消息
en.json
Module Error (from ./node_modules/thread-loader/dist/cjs.js):
2:11  error  Parsing error: Missing semicolon.

参考
https://github.com/eslint/eslint/discussions/15801
https://stackoverflow.com/questions/61131010/typescript-complains-about-missing-semicolon-on-imported-json-module