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>
相关推荐
Smile_Gently2 小时前
前端:最简单封装nmp插件(组件)过程。
前端·javascript·vue.js·elementui·vue
nihui1237 小时前
Uniapp 实现顶部标签页切换功能?
javascript·vue.js·uni-app
一 乐8 小时前
高校体育场管理系统系统|体育场管理系统小程序设计与实现(源码+数据库+文档)
前端·javascript·数据库·spring boot·高校体育馆系统
shengmeshi8 小时前
vue3项目img标签动态设置src,提示:ReferenceError: require is not defined
javascript·vue.js·ecmascript
BillKu9 小时前
vue3中<el-table-column>状态的显示
javascript·vue.js·elementui
祈澈菇凉9 小时前
ES6模块的异步加载是如何实现的?
前端·javascript·es6
我爱学习_zwj9 小时前
4.从零开始学会Vue--{{组件通信}}
前端·javascript·vue.js·笔记·前端框架
*TQK*10 小时前
✨1.HTML、CSS 和 JavaScript 是什么?
前端·javascript·css·html
优联前端10 小时前
DeepSeek 接入PyCharm实现AI编程!(支持本地部署DeepSeek及官方DeepSeek接入)
javascript·pycharm·ai编程·前端开发·优联前端·deepseek
萧大侠jdeps10 小时前
el-select 添加icon
前端·javascript·vue.js