pycharm设定代码模板

1、在文件点击设置

​​​​​​​ ​​​​​​​

2、点击编辑器--实时模板--找到需要插入模板的位置如我要插入HTML的模板---选择+--点击实时模板

3、如图:

4、添加模板内容,如果模板有变量可以在编辑变量处点击编辑

5、编辑变量

6、点击定义,确定模板使用范围,如我的是HTML,弄好后确定。

​​​​​​​

7在新建文件输入简写hvue后按tab键,效果:

8、模板代码:

html 复制代码
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>$FILE_NAME$</title>
    <script src="./dist/vue.global.js"></script>
    <script>
          // 动态标题
          var dynamicTitle = "$FILE_NAME$".slice(0, -5);
          // 使用 JavaScript 修改 <title> 标签的内容
          document.title = dynamicTitle;
      </script> 
</head>
<body>
    <div id="app">
      
    </div>
    <script type="module">
      const { createApp, ref } = Vue
      createApp({
        components:{
          
        },
        setup() {
          const msg = ref('Hello vue!')
          return {
            msg
          }
        }
      }).mount('#app')
    </script>

</body>
</html>
相关推荐
一天 24h19 分钟前
Vue3父子组件传值:从零到精通
前端·javascript·vue.js·pycharm·npm·学习方法
大家的林语冰27 分钟前
CSS 新函数上市,一行代码让文本自动变色,无需 JS 也能符合 W3C 无障碍对比度标准
前端·javascript·css
爱勇宝27 分钟前
前端工程师的下一站:不是失业,而是 AI Engineer
前端·javascript·架构
小雨下雨的雨37 分钟前
电池电量检测工具 - 鸿蒙PC用Electron框架技术实现详解
前端·javascript·华为·electron·鸿蒙·鸿蒙系统
砍材农夫1 小时前
物联网实战:Spring Boot MQTT | 模拟器Paho客户端拆解核心点
java·javascript·网络·spring boot·后端·物联网
小李云雾1 小时前
Vue Router 从入门到精通:路由核心知识点全解析
前端·javascript·vue.js
weixin_539446781 小时前
使用Java HttpServletResponse和JavaScript Fetch下载文件
java·javascript·python
小雨下雨的雨1 小时前
近视度数模拟器鸿蒙PC Electron框架技术实现详解
前端·javascript·electron
TE-茶叶蛋1 小时前
Next.js中App Router 全部特殊文件一览
开发语言·javascript·网络
小雨下雨的雨2 小时前
鸿蒙PC用Electron框架——Canvas蜡笔抖动效果实现技术深度解析
前端·javascript·华为·electron·鸿蒙系统