当前位置: 首页 > news >正文

webstorm 创建运行纯Typescript项目

创建一个空项目,在项目根目录创建一个tsconfig.json文件
自动配置:
打开终端输入tsc --init,即可自动生成tsconfig.json文件
手动配置:
在项目根目录下新建一个tsconfig.json文件,并配置如下内容
具体配置可以直接使用下面的配置,详细配置可以去官网查考每一个属性对应的作用

官网地址:https://www.tslang.cn/docs/handbook/compiler-options.html

{"compilerOptions": {"target": "esnext","useDefineForClassFields": true,"module": "esnext","moduleResolution": "node","strict": true,"noLib": false,"sourceMap": true,"resolveJsonModule": true,  // JSON模块导入允许"esModuleInterop": true,"lib": ["esnext", "dom"],"baseUrl": ".","allowJs": true,  //编译JS/*  "paths": {"@*//*": ["src*//*"]},*/"types": ["vite/client", "unplugin-icons/types/vue", "element-plus/global"],"skipLibCheck": true /* Skip type checking all .d.ts files. */,"allowSyntheticDefaultImports": true /* 允许默认导入 */,"forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,"jsx": "preserve","jsxFactory": "h","jsxFragmentFactory": "Fragment"},"include": ["src/**/*.ts","src/**/*.vue","src/typings/**/*.d.ts","mock/**/*.ts","vite.config.ts","vite.config.ts","types/**/*.ts"],"exclude": ["node_modules", "dist", "**/*.js"]
}

 配置TS

配置TS文件监控

创建一个TS

class Student {fullName: string;constructor(public firstName: any, public middleInitial: any, public lastName: any) {this.fullName = firstName + " " + middleInitial + " " + lastName;}
}interface Person {firstName: string;lastName: string;
}function greeter(person: Person) {return "Hello, " + person.firstName + " " + person.lastName;
}let user = new Student("Jane", "M.", "User");
console.log(greeter(user));

编译生成JS

tsc src/classGreeter

运行: node .\src\classGreeter.js

直接右键run命令

run这个命令,这个时候进行如下操作:
①安装直接运行所需依赖包: npm install -g ts-node

2.安装插件:Run Configuration for TypeScript

 在插件里安装失败

直接去网页: Run Configuration for TypeScript - IntelliJ IDEs Plugin | Marketplace下载jar包,然后导入插件也可以用

右键运行效果

相关文章:

webstorm 创建运行纯Typescript项目

创建一个空项目,在项目根目录创建一个tsconfig.json文件自动配置: 打开终端输入tsc --init,即可自动生成tsconfig.json文件手动配置: 在项目根目录下新建一个tsconfig.json文件,并配置如下内容 具体配置可以直接使用下面的配置&am…...

GO-接口

1. 接口 在Go语言中接口(interface)是一种类型,一种抽象的类型。 interface是一组method的集合,接口做的事情就像是定义一个协议(规则),只要一台机器有洗衣服和甩干的功能,我就称它…...

【C语言】动态内存管理常用函数

前言 我们在之前学习的数组开辟的空间是固定不变的,有时候我们需要的空间⼤⼩在程序运⾏的时候才能知道~ c语言中的动态内存开辟,让程序员⾃⼰可以根据实际需求申请和释放相应空间,这使得空间的开辟变得灵活了许多。 欢迎关注个人主页&#x…...

【OpenGL】(1) 专栏介绍:OpenGL 库 | 3D 计算机图形应用 | GPGPU 计算 | 3D 建模和 3D动画 | 渲染技术介绍

🔗 《C语言趣味教程》👈 猛戳订阅!!! 💭 写在前面:本专栏主要内容是关于 3D 计算机图形技术的学习,重点是学习与此技术相关的 3D 实时渲染 (3D real-time rendering) 技术。我们会以…...

SPI总线知识总结

1 SPI的时钟极性CPOL和时钟相位CPHA的设置 1.1 SPI数据传输位数 SPI传输数据过程中总是先发送或接收高字节数据,每个时钟周期接收器或发送器左移一位数据。对于小于16位的数据,在发送前必须左对齐,如果接收的数据小于16位,则采用软…...

【异常关闭clas*h,导致无法访问任何网页_解决办法】

各位经常使用Clash Scientific浏览的朋友们,我要建议大家不要在开启Clash代理的情况下直接关机或者重启电脑,这样的操作会导致网络配置出现严重问题,带来不必要的麻烦。 这是我亲身体验的一次痛苦教训。不管是我在关闭or开启Clas*h代理后&am…...

STL-map和set

目录 一、关联式容器 二、键值对 三、树形结构的关联式容器 3.1 set 3.1.1 set介绍 3.1.2 set的使用 1. set的模板参数列表 2. set的构造 3. set的迭代器(类型是双向迭代器) 4. set的容量 5.set修改操作 6、operator 7. set的使用举例 3.2 map 3.2.1map介绍 3.2.2map的…...

[蓝桥杯 2020 省 B1] 整除序列

[蓝桥杯 2020 省 B1] 整除序列 题目描述 有一个序列,序列的第一个数是 n n n,后面的每个数是前一个数整除 2 2 2,请输出这个序列中值为正数的项。 输入格式 输入一行包含一个整数 n n n。 输出格式 输出一行,包含多个整数…...

【Android】View 的滑动

View 的滑动是 Android 实现自定义控件的基础,同时在开发中我们也难免会遇到 View 的滑动处理。其实不管是哪种滑动方式,其基本思想都是类似的:当点击事件传到 View 时,系统记下触摸点的坐标,手指移动时系统记下移动后…...

基于ZYNQ的PCIE高速数据采集卡的设计(一)

作为信息处理的第一步,数据采集的作用越来越重要。目前,数据采集已经在航 空、民用、军事、医疗等领域得到广泛应用。随着相关技术的不断发展,信号频率越 来高,带宽越来越大,使得数据采集技术逐渐向高速大数据的方向…...

渗透测试工具 nmap 详解

官网:Nmap: the Network Mapper - Free Security Scanner -p<端口范围>:仅扫描指定的端口 用于扫描指定端口是否开放,在 -p 后输入指定的端口,以英文","进行拼接多个指定端口。 nmap -p 80&…...

Ubuntu下安装Scala

前言 弄了一下终于成功装上了,这里对此进行一下总结 安装虚拟机 VMware虚拟机安装Ubuntu(超详细图文教程)_vmware安装ubuntu-CSDN博客https://blog.csdn.net/qq_43374681/article/details/129248167Download Ubuntu Desktop | Download | …...

无法启动报,To install it, you can run: npm install --save @/components/iFrame/index

运行的过程中后台报错 npm install --save /components/iFrame/index,以为是安装三方依赖错误,经过多次重装node_modules依然没有用。 没办法,只能在项目中搜索 components/iFrame/index这个文件。。突然醒悟。。。 有时候,犯迷…...

深入理解现代JavaScript:从语言特性到应用实践

💂 个人网站:【 海拥】【神级代码资源网站】【办公神器】🤟 基于Web端打造的:👉轻量化工具创作平台💅 想寻找共同学习交流的小伙伴,请点击【全栈技术交流群】 JavaScript作为一门动态、解释性脚本语言&…...

ThreadPoolExecutor 学习

ThreadPoolExecutor 是开发中最常用的线程池,今天来简单学习一下它的用法以及内部构造。 1、线程池存在的意义? 一般在jvm上,用户线程和操作系统内核线程是1:1的关系,也就是说,每次创建、销毁线程的时候&am…...

深入理解计算机操作系统书籍阅读感悟(一)

1.sp:表示为空格,ASCII为32 2.在我们写的每行程序结尾都有一个隐藏的\n(ASCII码值为10) 3.在书上的P2页上说:文本文件是指以ASCII码字符构成的文件,其余都是二进制文件 除了这种理解,更常见的…...

使用query请求数据出现500的报错

我在写项目的时候遇到了一个问题,就是在存商品id的时候我将它使用了JSON.stringify的格式转换了!!!于是便爆出了500这个错误!!! 我将JSON.stringify的格式去除之后,它就正常显示了&…...

PostgreSQL教程(二十一):服务器管理(三)之服务器设置和操作

本章讨论如何设置和运行数据库服务器,以及它与操作系统的交互。 一、PostgreSQL用户账户 和对外部世界可访问的任何服务器守护进程一样,我们也建议在一个独立的用户账户下运行PostgreSQL。这个用户账户应该只拥有被该服务器管理的数据,并且…...

Linux运维_Bash脚本_编译安装GNU-Tools

Linux运维_Bash脚本_编译安装GNU-Tools Bash (Bourne Again Shell) 是一个解释器,负责处理 Unix 系统命令行上的命令。它是由 Brian Fox 编写的免费软件,并于 1989 年发布的免费软件,作为 Sh (Bourne Shell) 的替代品。 您可以在 Linux 和 …...

leetcode 121.买卖股票的最佳时机

声明:以下仅代表个人想法,非官方答案或最优题解! 题目: 给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票,并选择在 未来的某一个不同的…...

浅谈 React Hooks

React Hooks 是 React 16.8 引入的一组 API,用于在函数组件中使用 state 和其他 React 特性(例如生命周期方法、context 等)。Hooks 通过简洁的函数接口,解决了状态与 UI 的高度解耦,通过函数式编程范式实现更灵活 Rea…...

python打卡day49

知识点回顾: 通道注意力模块复习空间注意力模块CBAM的定义 作业:尝试对今天的模型检查参数数目,并用tensorboard查看训练过程 import torch import torch.nn as nn# 定义通道注意力 class ChannelAttention(nn.Module):def __init__(self,…...

简易版抽奖活动的设计技术方案

1.前言 本技术方案旨在设计一套完整且可靠的抽奖活动逻辑,确保抽奖活动能够公平、公正、公开地进行,同时满足高并发访问、数据安全存储与高效处理等需求,为用户提供流畅的抽奖体验,助力业务顺利开展。本方案将涵盖抽奖活动的整体架构设计、核心流程逻辑、关键功能实现以及…...

多模态商品数据接口:融合图像、语音与文字的下一代商品详情体验

一、多模态商品数据接口的技术架构 (一)多模态数据融合引擎 跨模态语义对齐 通过Transformer架构实现图像、语音、文字的语义关联。例如,当用户上传一张“蓝色连衣裙”的图片时,接口可自动提取图像中的颜色(RGB值&…...

1.3 VSCode安装与环境配置

进入网址Visual Studio Code - Code Editing. Redefined下载.deb文件,然后打开终端,进入下载文件夹,键入命令 sudo dpkg -i code_1.100.3-1748872405_amd64.deb 在终端键入命令code即启动vscode 需要安装插件列表 1.Chinese简化 2.ros …...

跨链模式:多链互操作架构与性能扩展方案

跨链模式:多链互操作架构与性能扩展方案 ——构建下一代区块链互联网的技术基石 一、跨链架构的核心范式演进 1. 分层协议栈:模块化解耦设计 现代跨链系统采用分层协议栈实现灵活扩展(H2Cross架构): 适配层&#xf…...

从零开始打造 OpenSTLinux 6.6 Yocto 系统(基于STM32CubeMX)(九)

设备树移植 和uboot设备树修改的内容同步到kernel将设备树stm32mp157d-stm32mp157daa1-mx.dts复制到内核源码目录下 源码修改及编译 修改arch/arm/boot/dts/st/Makefile,新增设备树编译 stm32mp157f-ev1-m4-examples.dtb \stm32mp157d-stm32mp157daa1-mx.dtb修改…...

MySQL中【正则表达式】用法

MySQL 中正则表达式通过 REGEXP 或 RLIKE 操作符实现(两者等价),用于在 WHERE 子句中进行复杂的字符串模式匹配。以下是核心用法和示例: 一、基础语法 SELECT column_name FROM table_name WHERE column_name REGEXP pattern; …...

k8s业务程序联调工具-KtConnect

概述 原理 工具作用是建立了一个从本地到集群的单向VPN,根据VPN原理,打通两个内网必然需要借助一个公共中继节点,ktconnect工具巧妙的利用k8s原生的portforward能力,简化了建立连接的过程,apiserver间接起到了中继节…...

CMake控制VS2022项目文件分组

我们可以通过 CMake 控制源文件的组织结构,使它们在 VS 解决方案资源管理器中以“组”(Filter)的形式进行分类展示。 🎯 目标 通过 CMake 脚本将 .cpp、.h 等源文件分组显示在 Visual Studio 2022 的解决方案资源管理器中。 ✅ 支持的方法汇总(共4种) 方法描述是否推荐…...