大前端 vscode 插件:mk-vscode-tool

vscode 插件目前支持的功能是后台项目开发，常用代码片段的支持,后期会添加新的功能。

用法

直接键入前缀 mk-xxx,箭头切换就可以预览代码

目前支持的 snippets 汇总

这个表格是我们开发后台使用频率比较高的代码

ElementUI 部分

Form Part

Data Part

Navigation Part

Others Part

Snippets

Support snippets list:

• mk-get

    let data = {};
    lib.api.get({
        api: '',
        data: data,
        success:(res) => {
        },
        error: (err) => {
        },
        complete: () => {
        }
    })
  

• mk-post

    let data = {};
    lib.api.post({
        api: '',
        data: data,
        success:(res) => {
        },
        error: (err) => {
        },
        complete: () => {
        }
    })
  

• mk-alert

    this.$alert('这是一段内容', '标题名称', {
    confirmButtonText: '确定',
    callback: action => {
        this.$message({
            type: 'info',
            message: `action: ${ action }`
            });
        }
    });
  

• mk-confirm

    this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
        }).then(() => {
            this.$message({
                type: 'success',
                message: '删除成功!'
            });
        }).catch(() => {
        this.$message({
            type: 'info',
            message: '已取消删除'
        }); 
    });
  

• mk-push

   this.$router.push({ path: `` });
  

• mk-message

  this.$message('这是一条消息提示');
  

• mk-message-error

   this.$message.error('这是一条错误消息提示');
  

• mk-message-success

  this.$message.success('这是一条成功消息提示');
  

• mk-message-warning

   this.$message.warning('这是一条警告消息提示');
  

• msg

  this.$message({
    message: '',
    type: ''
  })
  

• alert

  this.$alert('', '', {
    confirmButtonText: '',
    callback: () => {}
  });
  

• confirm

  this.$confirm('', '', {
    confirmButtonText: '',
    cancelButtonText: '',
    type: ''
  }).then(() => {})
    .catch(() => {});
  

• prompt

  this.$prompt('', '', {
    confirmButtonText: '',
    cancelButtonText: '',
    inputPattern: //,
    inputErrorMessage: ''
  }).then(({ value }) => {})
    .catch(() => {});
  

• msgb

  this.$msgbox({
    title: '',
    message: '',
    showCancelButton: '',
    confirmButtonText: '',
    cancelButtonText: '',
    beforeClose: (action, instance, done) => {}
  }).then(action => {});
  

• notify

  this.$notify({
    title: '',
    message: ''
  });
  

• dialog

  <el-dialog
    title="提示"
    :visible.sync="dialogVisible"
    width="30%"
    :before-close="handleClose">
    <span>这是一段信息</span>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
    </span>
  </el-dialog>
  

写在最后

一起来顺畅的写代码!目前插件还没有很完善,有任何问题都可以来和我交流一下,期待新的想法,繁杂基础的工作都可以交给工具来处理,我们只负责核心逻辑的构建!

Enjoy!