如何让idea支持.vue文件

1. 首先安装Vue.js

步骤如下:
在设置中找到Plugins然后搜索Vue.js插件,然后安装插件,安装完插件后重启idea

2. 设置vue文件的模板

2.1 如果存在vue的模板

在在模板的话直接按下图所示操作进行

2.2 如果不存在vue的模板

如果不存在模板就点击"+"号新建一个,然后按照3,4,5,6的步骤继续操作下去

模板内容如下 :

<template>
    <div>
        {{msg}}
    </div>
</template>
<script>
  // import __ from '__' // __是需要手动引入的文件
  export default {
    name: '',
    components: {},
      data () {
          return {msg: '这个是Home模板页'}
      },
      methods: {}
  }
</script>
<style lang="postcss" scoped>
  body {
      background-color: #ff0000;
  }
</style>

3. 设置File Types

按照下图所示进行操作

4. 创建vue文件

根据自己前面的操作选择创建方式,2.1和2.2两种方式都可创建vue文件

创建好的vue文件如下