TypeScript论坛 今日: 0|主題: 300|排名: 74 

前言 公司需要写一些简单的前端代码, 说起前端, 那可就大了去了, 我不是专业的, 也没打算干这个, 只能说挑一个简单能用的框架来学了. 在很早之前, 写过一些前端, 那时候还是 Bootstrap 一把梭, 印象比较深的就是自适应栅格, 现在的话, 用的比较多的应该是 Vue 了, 希望一切顺利. 本次 Vue 的学习过程, 主要是参考了视频 尚 ...

一、类型type 1.1、定义 Type又叫类型别名（type alias）,作用是给一个类型起一个新名字，不仅支持interface定义的对象结构，还支持基本类型、联合类型、交叉类型、元组等任何你需要手写的类型。 type Num = number; // 基本类型 type StringOrNum = string | number; // 联合类型 type Person = {name: string}; // 对象 ...

刚完成一些前端项目的开发，腾出精力来总结一些前端开发的技术点，以及继续完善基于SqlSugar的开发框架循序渐进介绍的系列文章，本篇随笔主要介绍一下基于Vue3+TypeScript的全局对象的注入和使用。我们知道在Vue2中全局注入一个全局变量使用protoType的方式，很方便的就注入了，而Vue3则不能通过这种方式直接使用，而是显得 ...

一、编译选项与配置文件 自动编译文件 编译文件时，使用 -w 指令后，TS编译器会自动监视文件的变化，并在文件发生变化时对文件进行重新编译。 示例： tsc xxx.ts -w 自动编译整个项目  如果直接使用tsc指令，则可以自动将当前项目下的所有ts文件编译为js文件。 但是能直接使用tsc命令的前提时，要先 ...

一、原始数据类型基本使用 TypeScript中拥有更多的类型，如下表所示： 类型例子描述 number 1, -33, 2.5 任意数字 string 'hi', "hi", hi 任意字符串 boolean true、false 布尔值true或false 字面量 其本身 限制变量的值就是该字面量的值 any * 任意类型 unknown * 类型安全的any void 空值（undefin ...

1.创建项目 npm init vite@latest <project-name> # ornpm init vite-app hello-vue3 # or yarn create vite-app hello-vue3 2. 配置端口号 以及配置别名，解决vue中 引入ref..的插件 配置端口号+配置代理： 打开 vite.config.ts 文件：   添加server就可以了   server: {       & ...

一、TypeScript概要 TypeScript是一种由微软开发的自由和开源的编程语言，它是JavaScript的一个超集，扩展了JavaScript的语法，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。安德斯·海尔斯伯格，C#的首席架构师，工作于TypeScript的开发。 官网：http://www.typescriptlang.org/ github：https://gi ...

⒈解构数组 　　最简单的解构莫过于数组的解构赋值了： let input = [1, 2]; let [first, second] = input; console.log(first); // outputs 1 console.log(second); // outputs 2 　　这创建了2个命名变量 first 和 second。 等价于下面使用了索引的代码，但更为方便： first = input[0]; second = inp ...

第一章 快速入门 0、TypeScript简介 TypeScript是JavaScript的超集。 它对JS进行了扩展，向JS中引入了类型的概念，并添加了许多新的特性。 TS代码需要通过编译器编译为JS，然后再交由JS解析器执行。 TS完全兼容JS，换言之，任何的JS代码都可以直接当成JS使用。 相较于JS而言，TS拥有了静态类型，更加严格的语法，更强大的 ...

目录1，前言2，效果图3，如何使用3.1，安装3.2，配置4，示例5，插件错误处理5.1，错误触发原因5.2，解决办法 1，前言 在vite/webpack搭建的项目中，不管是vue还是react，都可以写jsx/tsx，为了避免样式污染，常用的方式有两种。一种是每个组件都用一个唯一类名class包裹，使用less/scss嵌套样式。另一种是使用cssModule模块 ...

步骤 使用 yarn add 安装 @vue/cli-service 对应版本的 @vue/cli-plugin-typescript 例如:"@vue/cli-service": "~4.5.0" 使用yarn add -D @vue/cli-plugin-typescript@^4安装 使用 vue invoke typescript 运行插件 插件提供的配置项 Use class-style component syntax? 是否使用类组件 类组件是通过 typescript 提供 ...

随着Vue3和TypeScript的大浪潮不断袭来，越来越多的Vue项目采用了TypeScript的语法来编写代码，而Vue3的JS中的Setup语法糖也越来越广泛的使用，给我们这些以前用弱类型的JS语法编写Vue代码的人不少冲击，不过随着大量的学习和代码编写，经历过一段难熬的时间后，逐步适应了这种和之前差别不小的写法和冲击。本篇随笔介绍总 ...

依赖说明 入口文件 tsconfig配置 webpack配置文件 webpack入口文件配置 webpack为typescript和less文件配置各自的loader webpack的output配置 运行webpack进行打包 测试验证 输出esm模块 已经输出了umd格式的js了, 为什么还要输出esm模块? ----TreeShaking 用tsc输出esm和类型声明文件 完善package.json文件 packag ...

Vue3 的父子组件传值、绑定表单数据、UI库的二次封装、防抖等，想来大家都很熟悉了，本篇介绍一种使用 Typescript 的方式进行统一的封装的方法。 基础使用方法 Vue3对于表单的绑定提供了一种简单的方式：v-model。对于使用者来说非常方便，v-model="name" 就可以了。 自己做组件 但是当我们要自己做一个组件的时候，就有 ...

函数 函数是 JavaScript 应用程序的基础，它帮助你实现抽象层，模拟类，信息隐藏和模块。在 TypeScript 里，虽然已经支持类，命名空间和模块，但函数仍然是主要的定义行为的地方。TypeScript 为 JavaScript 函数添加了额外的功能，让我们可以更容易地使用。   基本示例 和 JavaScript 一样，TypeScript 函数可以创建有 ...

前言 对于传统的 JavaScript 程序我们会使用函数和基于原型的继承来创建可重用的组件，但对于熟悉使用面向对象方式的程序员使用这些语法就有些棘手，因为他们用的是基于类的继承并且对象是由类构建出来的。 从 ECMAScript 2015，也就是 ES6 开始， JavaScript 程序员将能够使用基于类的面向对象的方式。 使用 TypeScript， ...

基础类型 TypeScript 支持与 JavaScript 几乎相同的数据类型，此外还提供了实用的枚举类型方便我们使用。   布尔值 最基本的数据类型就是简单的true/false值，在JavaScript和TypeScript里叫做boolean（其它语言中也一样） let isDone: boolean = false; console.log(isDone) isDone = true; // ok // isDone = 2 // e ...

vue3 的 props Vue3 的 props ，分为 composition API 的方式以及 option API 的方式，可以实现运行时判断类型，验证属性值是否符合要求，以及提供默认值等功能。 props 可以不依赖TS，自己有一套运行时的验证方式，如果加上TS的话，还可以实现在编写代码的时候提供约束、判断和提示等功能。 Prop 的校验 官网：https://sta ...

前言 上一篇 TypeScript – Get Started 使用了命令 tsc index.ts --module es2015 很少人会在命令时给写 config, 更正规的做法是创建一个 tsconfig.json 把所有 config 写到里面去. 类似 webpack.config.js, tailwind.config.js, .eslintrc.json, prettier.config.js, stylelint.config.j ...

目录结合React+TypeScript进行Electron开发1. electron基本简介为什么选择electron？2. 快速上手2.1 安装React(template为ts)2.2 快速配置React2.3 安装electron2.4 配置main.js、preload.js和package.json文件2.5 运行electron项目2.6 打包项目3. 自动刷新页面4. 主进程和渲染进程5.定义原生菜单、顶部菜单5.1 自定义菜单5 ...