Webstorm 添加新建文件类型
以创建 Vue 文件为例:
File—Setting—Editor—File and Code Template 分支,点击添加,依次输入 Name 和 Extension,OK 即可。如图:
Webstorm 创建文件模板
Webstorm 新建文件过程中现在文件头部加入创建时间,作者信息,项目名称,需要用到修改默认的模板,即上一步,模板代码:
<!--
文件描述:
创建时间:${DATE} ${TIME}
创建人:${USER}
-->
<template>
<div class="">
</div>
</template>
<script>
// 这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
// 例如:import 《组件名称》 from '《组件路径》';
// 例如:import uploadFile from '@/components/uploadFile/uploadFile'
export default {
name: '${COMPONENT_NAME}',
// import引入的组件需要注入到对象中才能使用
components: {},
data () {
// 这里存放数据
return {
}
},
// 监听属性 类似于data概念
computed: {},
// 方法集合
methods: {},
// 监控data中的数据变化
watch: {},
// 生命周期 - 创建完成(可以访问当前this实例)
created () {
},
// 生命周期 - 挂载完成(可以访问DOM元素)
mounted () {
},
beforeCreate () {
}, // 生命周期 - 创建之前
beforeMount () {
}, // 生命周期 - 挂载之前
beforeUpdate () {
}, // 生命周期 - 更新之前
updated () {
}, // 生命周期 - 更新之后
beforeDestroy () {
}, // 生命周期 - 销毁之前
destroyed () {
}, // 生命周期 - 销毁完成
activated () {
} // 如果页面有keep-alive缓存功能,这个函数会触发
}
</script>
<style scoped lang="scss">
//@import url(); 引入公共css类
</style>
Webstorm 提供了常用的预定义模板变量,用户名,项目名称,时间,年,月,日等
- ${PROJECT_NAME} - 当前项目的名称
- ${NAME} - 在创建文件期间在新建文件对话框中指定的文件名称
- ${USER} - 系统的当前用户登录名称
- ${DATE} - 当前系统日期
- ${TIME} - 当前系统时间
- ${YEAR} - 当前年份
- ${MONTH} - 当前月份
- ${DAY} - 当前月的日期
- ${HOUR} - 当前时刻
- ${MINUTE} - 当前分钟
- ${PRODUCT_NAME} - 将被创建文件所在的 IDE 名称
- ${MONTH_NAME_SHORT} - 月份名称的前 3 个字母,例如: Jan, Feb, etc.
- ${MONTH_NAME_FULL} - 月份全称,例如: January, February, etc.
本资源由随笔博客发布。发布者:五维国度,转载请注明出处:http://blog.suibi.site/archives/4271
本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。