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>
相关推荐
真滴book理喻1 小时前
Vue(四)
前端·javascript·vue.js
程序员_三木1 小时前
Three.js入门-Raycaster鼠标拾取详解与应用
开发语言·javascript·计算机外设·webgl·three.js
不是鱼2 小时前
构建React基础及理解与Vue的区别
前端·vue.js·react.js
开心工作室_kaic3 小时前
springboot476基于vue篮球联盟管理系统(论文+源码)_kaic
前端·javascript·vue.js
川石教育3 小时前
Vue前端开发-缓存优化
前端·javascript·vue.js·缓存·前端框架·vue·数据缓存
搏博3 小时前
使用Vue创建前后端分离项目的过程(前端部分)
前端·javascript·vue.js
isSamle3 小时前
使用Vue+Django开发的旅游路书应用
前端·vue.js·django
温轻舟3 小时前
前端开发 之 12个鼠标交互特效上【附完整源码】
开发语言·前端·javascript·css·html·交互·温轻舟
web135085886353 小时前
2024-05-18 前端模块化开发——ESModule模块化
开发语言·前端·javascript
ss2734 小时前
基于Springboot + vue实现的汽车资讯网站
vue.js·spring boot·后端