vs code 一鍵生成vue 模板

1.使用快捷Ctrl + Shift + P喚出控制檯,然後輸入snippets並選擇。(或 文件>首選項>用戶代碼片斷裏面,輸入 vue.json ,然後回車 )(或 file > Preferences > User Snippets,當彈出搜索框之後,輸入 vue.json ,然後回車)

 

2.接着輸入vue,vs code自動生成vue.json文件。

 

3.將vue.json文件改爲下面得模板(可根據個人需求修改當中的模板內容)   

 {
        // Example:
        "Print to console": {
            "prefix": "vue",
            "body": [
                "<template>",
                "  <div class=\"wrapper\">$0</div>",
                "</template>",
                "",
                "<script>",
                "export default {",
                "  components: {},",
                "  props: {},",
                "  data() {",
                "    return {",
                "    };",
                "  },",
                "  watch: {},",
                "  computed: {},",
                "  methods: {},",
                "  created() {},",
                "  mounted() {}",
                "};",
                "</script>",
                "<style lang=\"scss\" scoped>",
                ".wrapper{}",
                "</style>"
            ],
            "description": "A vue file template"
        }
    }

然後新建一個 aaa.vue 文件,輸入“vue”,按下回車鍵或者Tab鍵,模板就自動生成了:

是不是很實用和方便呢?

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章