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

TypeScript-- 配置Typescript环境(1)ts 转js,tsc --watch 实时编译

文章目录

    • 安装Typescript
    • 判断是否有运行权限
    • 编写第一Typescript文件
    • 手动编译Ts文件转Js文件
    • 实时编译


安装Typescript

npm install -g typescript

判断是否有运行权限

命令行运行

tsc -v

遇到了权限问题

在这里插入图片描述

用管理员打开window自带的powershell

在这里插入图片描述
运行如下指令即可:

Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy Unrestricted

在这里插入图片描述
重新打印版本号,如下表示成功了。

在这里插入图片描述

编写第一Typescript文件

// greeter.ts
function greeter(person) {return "Hello, " + person;
}let user = "Jane User";document.body.textContent = greeter(user);

手动编译Ts文件转Js文件

tsc greeter.ts

在这里插入图片描述
自动生成了对应的JS文件了

// 自动生成的 greeter.js
function greeter(person) {return 'Hello, ' + person;
}
var user = 'Jane User';
document.body.textContent = greeter(user);

实时编译

tsc --watch greeter.ts

这样,只要修改greeter.ts,就会自动编译成greeter.js了。


:)

额外:刚玩typescript的小白,如果把一些JS代码放在配置了TS的项目,那就会如下显示:

在这里插入图片描述

由于篇幅原因,将在本专栏其他文章讲解TS文件处理红色波浪线的几种方式,可从本文章开发进入。

相关文章:

TypeScript-- 配置Typescript环境(1)ts 转js,tsc --watch 实时编译

文章目录 安装Typescript判断是否有运行权限编写第一Typescript文件手动编译Ts文件转Js文件实时编译 安装Typescript npm install -g typescript 判断是否有运行权限 命令行运行 tsc -v 遇到了权限问题 用管理员打开window自带的powershell 运行如下指令即可: Set-…...

Dockerfile快速搭建自己专属的LAMP环境,生成镜像lamp:v1.1,并推送到私有仓库

环境: CentOS 7 Linux 3.10.0-1160.el7.x86_64 具体要求如下: (1)基于centos:6基础镜像; (2)指定作者信息; (3)安装httpd、mysql、mysql-server、php、ph…...

Lottery抽奖项目学习第二章第一节:环境、配置、规范

Lottery抽奖项目学习第二章第一节:环境、配置、规范 环境、配置、规范 下面以DDD架构和设计模式落地实战的方式,进行讲解和实现分布式抽奖系统的代码开发,那么这里会涉及到很多DDD的设计思路和设计模式应用,以及互联网大厂开发中…...

OpenCV之reshape函数

函数原型: /** brief Changes the shape and/or the number of channels of a 2D matrix without copying the data.The method makes a new matrix header for \*this elements. The new matrix may have a different sizeand/or different number of channels. A…...

【JavaEE】Spring事务-@Transactional参数介绍-事务的隔离级别以及传播机制

【JavaEE】Spring事务(2) 文章目录 【JavaEE】Spring事务(2)1. Transactional 参数介绍1.1 value 和 transactionManager1.2 timeout1.3 readOnly1.4 后面四个1.5 isolation 与 propagation 2. Spring 事务隔离级别 - isolation2.…...

微信小程序canvas type=2d生成海报保存到相册、文字换行溢出显示...、文字删除线、分享面板

一、简介 做个简单的生成二维码海报分享,我做的时候也找简单的方法看能不能实现页面直接截图那种生成图片,原生小程序不支持,不多介绍下面有全部代码有注释、参数自行替换运行看看,还有需要优化的地方,有问题可以咨询…...

C++卷积神经网络

C卷积神经网络 #include"TP_NNW.h" #include<iostream> #pragma warning(disable:4996) using namespace std; using namespace mnist;float* SGD(Weight* W1, Weight& W5, Weight& Wo, float** X) {Vector2 ve(28, 28);float* temp new float[10];V…...

go 读取yaml映射到struct

安装 go get gopkg.in/yaml.v3创建yaml Mysql:Host: 192.168.214.134Port: 3306UserName: wwPassword: wwDatabase: go_dbCharset: utf8mb4ParseTime: trueLoc: LocalListValue:- haha- test- vv JWTSecret: nidaye定义结构体 type Mysql struct {Host string yaml:&…...

Redis 10 大数据类型

1. which 10 1. redis字符串 2. redis 列表 3. redis哈希表 4. redis集合 5. redis有序集合 6. redis地理空间 7. redis基数统计 8. redis位图 9. redis位域 10. redis流 2. 获取redis常见操作指令 官网英文&#xff1a;https://redis.io/commands 官网中文&#xff1a;https:/…...

优化生产流程:数字化工厂中的OPC UA分布式IO模块应用

背景 近年来&#xff0c;为了提升在全球范围内的竞争力&#xff0c;制造企业希望自己工厂的机器之间协同性更强&#xff0c;自动化设备采集到的数据能够发挥更大的价值&#xff0c;越来越多的传统型工业制造企业开始加入数字化工厂建设的行列&#xff0c;实现智能制造。 数字化…...

Elasticsearch(十四)搜索---搜索匹配功能⑤--全文搜索

一、前言 不同于之前的term。terms等结构化查询&#xff0c;全文搜索首先对查询词进行分析&#xff0c;然后根据查询词的分词结果构建查询。这里所说的全文指的是文本类型数据&#xff08;text类型&#xff09;,默认的数据形式是人类的自然语言&#xff0c;如对话内容、图书名…...

已解决Gradle错误:“Unable to load class ‘org.gradle.api.plugins.MavenPlugin‘”

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…...

windows中安装sqlite

1. 下载文件 官网下载地址&#xff1a;https://www.sqlite.org/download.html 下载sqlite-dll-win64-x64-3430000.zip和sqlite-tools-win32-x86-3430000.zip文件&#xff08;32位系统下载sqlite-dll-win32-x86-3430000.zip&#xff09;。 2. 安装过程 解压文件 解压上一步…...

前端面试:【系统设计与架构】前端架构模式的演进

前端架构模式在现代Web开发中扮演着关键角色&#xff0c;它们帮助我们组织和管理前端应用的复杂性。本文将介绍一些常见的前端架构模式&#xff0c;包括MVC、MVVM、Flux和Redux&#xff0c;以及它们的演进和应用。 1. MVC&#xff08;Model-View-Controller&#xff09;&#x…...

【CSS】em单位的理解

1、em单位的定义 MDN的解释&#xff1a;它是相对于父元素的字体大小的一个单位。 例如&#xff1a;父元素font-size&#xff1a;16px&#xff1b;子元素的font-size&#xff1a;2em&#xff08;也就是32px&#xff09; 注&#xff1a;有一个误区&#xff0c;虽然他是一个相对…...

无涯教程-Python机器学习 - Based on human supervision函数

Python机器学习 中的 Based on human s - 无涯教程网无涯教程网提供https://www.learnfk.com/python-machine-learning/machine-learning-with-python-based-on-human-supervision.html...

【滑动窗口】leetcode209:长度最小的子数组

一.题目描述 长度最小的子数组 二.思路分析 题目要求&#xff1a;找出长度最小的符合要求的连续子数组&#xff0c;这个要求就是子数组的元素之和大于等于target。 如何确定一个连续的子数组&#xff1f;确定它的左右边界即可。如此一来&#xff0c;我们最先想到的就是暴力枚…...

C++ STL unordered_map

map hashmap 文章目录 Map、HashMap概念map、hashmap 的区别引用头文件初始化赋值unordered_map 自定义键值类型unordered_map 的 value 自定义数据类型遍历常用方法插入查找 key修改 value删除元素清空元素 unordered_map 中每一个元素都是一个 key-value 对&#xff0c;数据…...

全流程R语言Meta分析核心技术应用

Meta分析是针对某一科研问题&#xff0c;根据明确的搜索策略、选择筛选文献标准、采用严格的评价方法&#xff0c;对来源不同的研究成果进行收集、合并及定量统计分析的方法&#xff0c;最早出现于“循证医学”&#xff0c;现已广泛应用于农林生态&#xff0c;资源环境等方面。…...

Go并发可视化解释 - Select语句

昨天&#xff0c;我发布了一篇文章&#xff0c;用可视化的方式解释了Golang中通道&#xff08;Channel&#xff09;的工作原理。如果你对通道的理解仍然存在困难&#xff0c;最好呢请在阅读本文之前先查看那篇文章。作为一个快速的复习&#xff1a;Partier、Candier 和 Stringe…...

别再死磕理论了!用Python+Pytorch实战多示例学习(MIL)图像分类,附完整代码

用PythonPytorch实战多示例学习图像分类&#xff1a;从数据到模型的完整指南 当你第一次听说"多示例学习"&#xff08;Multiple Instance Learning, MIL&#xff09;时&#xff0c;是不是也被那些抽象的理论弄得一头雾水&#xff1f;作为计算机视觉领域的重要技术&am…...

别再为UI动画发愁了!用Spine+Unity 2021制作丝滑2D动画的保姆级流程

SpineUnity 2021&#xff1a;打造专业级2D UI动画的完整实战指南 在独立游戏开发领域&#xff0c;UI动画的质量往往决定着玩家的第一印象。那些流畅的按钮反馈、生动的界面过渡&#xff0c;不仅提升了产品质感&#xff0c;更直接影响着用户的留存率。然而对于资源有限的中小团队…...

告别重复劳动:用快马ai生成高效openclaw脚本提升安卓测试效率

告别重复劳动&#xff1a;用快马AI生成高效OpenClaw脚本提升安卓测试效率 在安卓自动化测试中&#xff0c;编写重复性的设备操作脚本往往是最耗时耗力的环节。每次测试新版本&#xff0c;我们都需要重复编写类似的点击、滑动、输入等操作代码&#xff0c;不仅效率低下&#xf…...

vue基于springboot架构的酒店管理系统 酒店商城购物系统

目录同行可拿货,招校园代理 ,本人源头供货商功能模块分析技术实现要点扩展功能建议项目技术支持源码获取详细视频演示 &#xff1a;文章底部获取博主联系方式&#xff01;同行可合作同行可拿货,招校园代理 ,本人源头供货商 功能模块分析 酒店管理系统功能 客房管理&#xff…...

Vue3项目实战:5分钟搞定DeepSeek API对接,打造你的专属AI聊天助手

Vue3项目实战&#xff1a;5分钟搞定DeepSeek API对接&#xff0c;打造你的专属AI聊天助手 最近在重构个人博客时&#xff0c;突然想到如果能给访客加个智能问答助手应该挺酷的。作为一个长期混迹开源社区的全栈开发者&#xff0c;我习惯性先搜了圈现有方案——结果发现DeepSeek…...

Phi-3-mini-4k-instruct-gguf一文详解:从网页问答到摘要改写的全流程应用

Phi-3-mini-4k-instruct-gguf一文详解&#xff1a;从网页问答到摘要改写的全流程应用 1. 认识Phi-3-mini-4k-instruct-gguf Phi-3-mini-4k-instruct-gguf是微软Phi-3系列中的轻量级文本生成模型GGUF版本。这个模型特别适合处理问答、文本改写、摘要整理和简短创作等任务。想象…...

TradingAgents-CN 多智能体金融分析系统:企业级容器化部署实战指南

TradingAgents-CN 多智能体金融分析系统&#xff1a;企业级容器化部署实战指南 【免费下载链接】TradingAgents-CN 基于多智能体LLM的中文金融交易框架 - TradingAgents中文增强版 项目地址: https://gitcode.com/GitHub_Trending/tr/TradingAgents-CN TradingAgents-CN…...

Ollama+Qwen2.5-VL搭建教程:打造你的智能视觉分析工具

OllamaQwen2.5-VL搭建教程&#xff1a;打造你的智能视觉分析工具 1. 引言&#xff1a;为什么选择Qwen2.5-VL 在当今AI技术快速发展的时代&#xff0c;视觉-语言多模态模型正成为解决复杂问题的关键工具。Qwen2.5-VL-7B-Instruct作为通义千问系列的最新成员&#xff0c;在视觉…...

5大核心功能解密:douyin-downloader抖音下载器实战指南

5大核心功能解密&#xff1a;douyin-downloader抖音下载器实战指南 【免费下载链接】douyin-downloader A practical Douyin downloader for both single-item and profile batch downloads, with progress display, retries, SQLite deduplication, and browser fallback supp…...

【ROS2 基础】ROS2与Colcon核心指令速查手册与避坑指南

为了在 ROS2 的日常开发中提升效率&#xff0c;本文为您整理了一份结构化的核心指令速查清单。去除了冗长的理论&#xff0c;直击实战痛点&#xff0c;并附带了多平台差异、性能优化数据以及常见报错的修复方案。 文章目录[TOC]一、 快速入门&#xff1a;3步跑通基础流程二、 版…...