Vue项目中API代码处删除分号是否可行？为何/* eslint-disable */规则不生效？

1. 删除API代码中的分号是否可行？ #

完全可行，只要你的代码没触发JavaScript自动分号插入（ASI）的“坑”场景就没问题。

先给你理清楚：JavaScript本身支持省略语句结尾的分号，ASI机制会在特定位置自动补充分号。看你贴的Kakao API相关代码，所有带分号的地方都是常规的语句结尾——比如变量赋值、函数调用、条件表达式结尾，这些场景下删掉分号不会引发任何运行时错误。

当然也得提醒你避开几个ASI容易出问题的情况（你的代码里没有这些，放心就行）：

• 不要在return、throw、break、continue后面直接换行
• 不要让一行代码以(、[、+、-、/开头（如果上一行没写分号的话）

你的代码里没有这些风险点，所以放心删掉分号就好。

2. 为何/* eslint-disable */规则不生效？ #

问题出在注释的位置不对！

Vue单文件组件的template、script、style是三个独立的代码块，Eslint只会识别对应代码块内部的规则注释。你把/* eslint-disable */放在了template和script标签之间，这个位置不属于script块的内容，Eslint根本读取不到这条指令。

正确的做法是把这条注释放在script标签内部的第一行，比如：

<script>
/* eslint-disable */
export default {
  mounted() {
    window.kakao && window.kakao.maps ? this.initMap() : this.addKakaoMapScript()
  },
  methods: {
    addKakaoMapScript() {
      const script = document.createElement("script")
      /* global kakao */
      script.onload = () => kakao.maps.load(this.initMap)
      script.src = "http://dapi.kakao.com/v2/maps/sdk.js?autoload=false&appkey=*APPKEY*"
      document.head.appendChild(script)
    },
    initMap() {
      var container = document.getElementById("map")
      var options = {
        center: new kakao.maps.LatLng(33.450701, 126.570667),
        level: 3
      }
      var map = new kakao.maps.Map(container, options)
    }
  }
}
</script>

另外，如果不想全局禁用script块的Eslint，也可以针对特定规则禁用，比如如果只是分号的问题，你可以用/* eslint-disable semi */，这样只会关闭分号相关的检查，其他规则依然生效，更推荐这种精准禁用的方式。

内容的提问来源于stack exchange，提问作者Lee