天道酬勤,学无止境

如何在 es6 中启用 ts-check(How to enable ts-check in es6)

问题

最近我发现 Visual Code 有一个很好的 JavaScript 文件类型检查功能。 我所要做的就是在文件顶部键入// @ts-check ,这对我来说是很大的好处,所以我想在每个 JavaScript 文件上全局使用它,我怎么能不写那行文件顶部的时间?

回答1

根据 Aleksey L. 的评论,我使用此配置添加到根目录tsconfig.json并且它可以工作:

{
    "compilerOptions": {
        "module": "system",
        "noImplicitAny": false,
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "outDir": "./dist",
        "rootDir": "./src",
        "checkJs": true,
        "allowJs": true,
        "jsx": "react",
        "experimentalDecorators": true,
        "moduleResolution": "node"
    },
    "include": [
        "src/**/*"
    ],
    "exclude": [
        "./node_modules",
        "dist"
    ]
}

另外,如果您想使用npm script检查它,您只需要安装typescript并在scripts部分使用此命令:

"typecheck": "tsc --project tsconfig.json --noEmit"

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • How to enable ts-check in es6
    Recently I have found Visual Code has a nice feature for type checking in JavaScript files. All I have to do is to type on top of file // @ts-check, it is great benefit for me, so I want to use it globally on every JavaScript file, how could I could I do it without writing that line every time on top of a file?
  • js 'types' 只能在 .ts 文件中使用 - Visual Studio Code 使用 @ts-check(js 'types' can only be used in a .ts file - Visual Studio Code using @ts-check)
    问题 我开始在我在 Visual Studio Code 中处理的 Node 项目中使用 TypeScript。 我想遵循类似于 Flow 的“选择加入”策略。 因此,我将// @ts-check放在我的.js文件的顶部,希望为该文件启用 TS。 最终我想要与 Flow 相同的“linting”体验,因此我安装了插件 TSLint 以便我可以看到 Intellisense 警告/错误。 但是我的文件看起来像: // @ts-check module.exports = { someMethod: (param: string): string => { return param; }, }; 和我的tsconfig.json文件看起来像... { "compilerOptions": { "target": "es2016", "module": "commonjs", "allowJs": true } } 我收到此错误: [js] 'types' can only be used in a .ts file. 如下图所示。 我看到了这个问题,它建议在 vscode 中禁用 javascript 验证,但这并没有向我显示任何TypeScript Intellisense 信息。 我尝试设置tslint.jsEnable到true在我的vscode设置作为TSLint扩展文档中提到
  • 是否可以在 ES6 项目中使用自定义类型定义?(Is it possible to use custom type definitions in an ES6 project?)
    问题 我的团队致力于一个相对较大的 NodeJS 项目,该项目用 ES6 编写,由 babel 转译,然后部署为无服务器的 AWS lambdas。 该项目专注于使用、映射/转换和输出我们定义的一种特定对象类型。 我们的问题是,ECMA/JavaScript 不是强类型的,所以如果我们犯了一个错误,比如将字段视为某个地方的数组而其他地方的字符串,除了运行时错误之外,没有什么可以捕捉到的。 我们也没有很好地记录这个对象的结构,所以有时消费者向我们发送对象的实例,其中包含我们说我们处理但实际上没有使用的稍微错误命名的字段中的数据。 我正在寻找一种方法来为我们项目中的这个特定对象创建某种模式或类型定义,以便我们可以使用它来更正我们的代码,使我们的处理更加健壮,并为其创建更好的文档。 现在,我知道 VSCode 在 JavaScript 中提供了一些基本的类型检查,但我认为尝试 JSDoc 一个非常大的对象然后将该文档放入每个使用该对象的文件中是不可行的。 我发现 VSCode 也可以以某种方式使用 .d.ts 文件进行检查,但我不明白我是否或如何将其用于我们设计的特定自定义对象。 我发现的大部分内容似乎与为外部库提取 .d.ts 文件特别相关。 那么,TL:DR,是否有可能在 NodeJS/ES6 项目中制作一个在整个项目中广泛使用的强类型对象? 在 VSCode
  • jsdoc : 从其他模块引用 typedef-ed 类型(jsdoc : reference typedef-ed type from other module)
    问题 假设我在 js 模块中有一个 typedef 类型 // somewhere/foo.js /** * @module */ /** * @typedef Foo * @type {object} * property {string} bar - some property */ 是否可以在另一个模块中引用此类型,以便在 jsdoc 生成的 HTML 页面中,该类型显示为指向 typedef-ed 模块的链接? 我尝试了这种变化,但似乎没有任何效果...... // somewhere_else/bar.js /** * @module */ /** * @param {somewhere/foo/Foo} foo - some param */ export default function doStuff(foo) { ... } 回答1 这对我有用... // somewhere/foo.js /** * @module foo */ /** * @typedef module:foo.Foo * @type {object} * @property {string} bar - some property */ 和 ... // somewhere_else/bar.js /// <reference path="foo.js" /> /** * @module
  • 忽略打字稿上的“找不到模块”错误(Ignore “cannot find module” error on typescript)
    问题 Typescript 编译器是否cannot find module 'x'忽略导入表达式上的cannot find module 'x'错误,例如: //How to tell the compiler that this module does exists import sql = require('sql'); 有多个 npm 库,例如 node sql 没有现有的类型 除了使用declare module x ...创建新定义文件之外,有没有办法告诉编译器忽略此错误? 回答1 如果你只是想绕过编译器,你可以为那个模块创建一个 .d.ts 文件,例如,你可以创建一个 sql.d.ts 文件,里面有这个: declare module "sql" { let _sql: any; export = _sql; } 回答2 从 TypeScript 2.6(2017 年 10 月 31 日发布)开始,现在有一种方法可以在目标行之前使用// @ts-ignore注释来忽略特定行中的所有错误。 提到的文档足够简洁,但要回顾一下: // @ts-ignore const s : string = false 禁用此行的错误报告。 然而,这应该只在修复错误或使用像(x as any)这样的 hack 比丢失一行的所有类型检查更麻烦时作为最后的手段使用。 至于指定某些错误
  • js 'types' can only be used in a .ts file - Visual Studio Code using @ts-check
    I am starting to use TypeScript in a Node project I am working on in Visual Studio Code. I wanted to follow the "opt-in" strategy, similar to Flow. Therefore I put // @ts-check at the top of my .js file in hope to enable TS for that file. Ultimately I want the same experience of "linting" as Flow, therefore I installed the plugin TSLint so I could see Intellisense warnings/errors. But with my file looking like: // @ts-check module.exports = { someMethod: (param: string): string => { return param; }, }; and my tsconfig.json file looking like... { "compilerOptions": { "target": "es2016", "module
  • 从 HTML 引用 TypeScript 定义文件` ` with VS Code(Reference TypeScript definition file from HTML `<script>` with VS Code)
    问题 我可以在 HTML 的script标签中使用JSDoc ,但无法引用类型定义文件 ( .d.ts )。 我正在使用VS Code 。 这可能吗,如果可以,我该怎么做? 下面是一些示例代码: tsconfig.json文件(我不确定如何在我的测试中完全使用它,它似乎不需要。): { "compilerOptions": { "baseUrl": ".", "paths": { "myLib": ["types/MyLib/index.d.ts"], "myLib2": ["types/MyLib/index2.d.ts"] } } } 尝试 1: 在types/MyLib/index.d.ts : declare namespace myLib { function makeGreeting(s: string): string let numberOfGreetings: number } 在 JS 文件index.js ,工作正常: /// <reference path="./types/MyLib/index.d.ts" /> // @ts-check var result = myLib.makeGreeting("Cheese") console.log(result) 在 HTML 文件中(这些都不起作用) index.html : <script> ///
  • 浅谈 TypeScript【下】-- TypeScript 语言规范与基本应用
    文章内容输出来源:拉勾教育 大前端高薪训练营 前言 在 【浅谈 TypeScript【上】】中,简单讲述了关于JavaScript静态类型检查工具Flow的用法等。可以看到,我们接下来讲述的TypeScript与它其实有很多相似之处。 TS 与 JS TypeScript 并不是一个完全新的语言, 它是 JavaScript 的超集,为 JavaScript 的生态增加了类型机制,并最终将代码编译为纯粹的 JavaScript 代码。 TypeScriptJavaScriptJavaScript 的超集用于解决大型项目的代码复杂性一种脚本语言,用于创建动态网页。可以在编译期间发现并纠正错误作为一种解释型语言,只能在运行时发现错误强类型,支持静态和动态类型弱类型,没有静态类型选项最终被编译成 JavaScript 代码,使浏览器可以理解可以直接在浏览器中使用支持模块、泛型和接口不支持模块,泛型或接口支持 ES3,ES4,ES5 和 ES6 等不支持编译其他 ES3,ES4,ES5 或 ES6 功能社区的支持仍在增长,而且还不是很大大量的社区支持以及大量文档和解决问题的支持 TypeScript 概述 首先,我们先来看一下 TypeScript的范围图: TypeScript 是由微软开发的一种开源、跨平台的编程语言,是JavaScript 的超集,主要提供了类型系统和对 ES6
  • Reference TypeScript definition file from HTML `<script>` with VS Code
    I am able to use JSDoc in a script tag in HTML but am not able to reference a type definition file (.d.ts). I'm using VS Code. Is this possible and if so how do I do it? Here's some example code below: The tsconfig.json file (I'm not sure how to quite use this in my tests, it doesn't seem to be needed.): { "compilerOptions": { "baseUrl": ".", "paths": { "myLib": ["types/MyLib/index.d.ts"], "myLib2": ["types/MyLib/index2.d.ts"] } } } Attempt 1: In types/MyLib/index.d.ts: declare namespace myLib { function makeGreeting(s: string): string let numberOfGreetings: number } In the JS file index.js
  • 关于TypeScript中的“ * .d.ts”(About “*.d.ts” in TypeScript)
    问题 我对*.d.ts感到好奇,因为我是TypeScript的新手。 有人告诉我,这种文件类似于C ++中的“头文件”,但仅适用于JS。 但是,除非我将*.js强制更改为*.ts否则我无法将纯JS文件转换为*.d.ts文件。 所以我有三个文件:一个JS文件,一个TS文件和一个*.d.ts文件。 他们之间是什么关系? 如何使用*.d.ts文件? 这是否意味着我可以永久删除*.ts文件? 如果是这样, *.d.ts文件如何知道哪个JS文件正在映射到其自身? 如果有人可以给我一个例子,那就太好了。 回答1 “ d.ts”文件用于提供有关用JavaScript编写的API的打字稿类型信息。 想法是您使用的是jQuery或下划线(一个现有的javascript库)。 您想使用打字稿代码中的代码。 您可以编写仅包含类型注释的d.ts文件,而不必重写jquery或下划线或打字稿中的任何内容。 然后从您的打字稿代码中,您仍然可以使用纯JS库获得静态类型检查的打字稿优势。 回答2 d代表声明文件: 编译TypeScript脚本时,可以使用一个选项来生成声明文件(扩展名为.d.ts),该文件用作已编译JavaScript中组件的接口。 在此过程中,编译器会剥离所有函数和方法体,并仅保留导出类型的签名。 然后,当第三方开发人员从TypeScript使用它时
  • JSDoc/JavaScript 语言服务:如何注释表达式? (如何施放)(JSDoc/JavaScript Language Service: how to annotate an expression? (how to cast))
    问题 我正在使用带有 JavaScript 语言服务的 Visual Studio Code,配置为: { "compilerOptions": { "checkJs": true } } 而且我找不到投射东西的方法,比如这里: 上面的示例应该在 Closure Compiler(未验证)中工作,如此处所述。 但我找不到 JavaScript 语言服务的等效语法。 我还尝试了以下更简单的语句,它也不起作用: let castedWindow = (/** @type {any} */(window)); // castedWindow: Window (I want `any`) 我在问如何进行强制转换,以及是否有人碰巧知道语法记录在哪里(或者,如果没有记录,它是如何工作的)。 我要问的甚至可能吗? 谢谢你的时间! 回答1 从 TypeScript 2.5 开始,引入了在 checkJs/@ts-check 模式下对类型断言/强制转换语法的支持。 在checkJs / @ts-check模式下键入断言/ checkJs语法 TypeScript 2.5 引入了在项目中使用纯 JavaScript 时断言表达式类型的能力。 语法是/** @type {...} */注释注释,后跟括号表达式,其类型需要重新评估。 例如: var x = /** @type {SomeType} */
  • 是否可以在打字稿中编写 webpack 配置?(Is it possible to write webpack config in typescript?)
    问题 我在搜索时看到有 webpack 的类型。 所以看起来我可以在打字稿中编写 webpack.config.js ? 但是我该怎么做呢? 回答1 你可以使用 TS 作为你的配置文件 (webpack.config.ts) 有一个明确的线索,请参阅源代码 使用的 ** interpret** 模块有一个扩展文件及其加载器的列表。 在突出显示的代码中,webpack 为默认文件生成了一个包含所有可能扩展名的数组。 例如,给webpack.config你会得到一个数组 webpack.config.ts webpack.config.js ...... 等等 为此,您需要安装支持加载扩展的软件包之一。 例如,TS 有一些节点包使您能够使用require('something.ts')并且该包将完成这项工作。 解释包指出需要这些包之一 ts-node、typescript-node、typescript-register、typescript-require 所以 npm/yarn ts-node然后只需放置一个webpack.config.ts文件,它就会起作用! 编辑:Webpack 文档现在有专门的配置语言部分,包括 TypeScript、CoffeeScript 和 Babel & JSX 回答2 我写了一篇题为“在 TypeScript 中编写 Webpack 配置
  • 如何在启用ES6功能的情况下运行Node.js应用程序?(How to run Node.js app with ES6 features enabled?)
    问题 我使用BabelJS(以前称为6to5)的require钩子来运行具有es6features的节点应用程序: // run.js require("babel/register"); require("./app.js6"); 我称node run.js运行我的app.js6 。 我需要安装BabelJS并为每个我想使用es6features的项目提供一个run.js。 我更喜欢像nodejs6 app.js6这样的电话。 如何独立实现该系统(Unix和Windows)? 回答1 将babel-cli和babel-preset-es2015 (aka ES6)依赖项添加到应用程序的package.json文件中,并定义一个start脚本: { "dependencies": { "babel-cli": "^6.0.0", "babel-preset-es2015": "^6.0.0" }, "scripts": { "start": "babel-node --presets es2015 app.js" } } 然后,您只需执行以下命令即可运行您的应用程序: npm start 如果您决定停止使用Babel(例如,一旦Node.js支持所有ES6功能),则可以将其从package.json中删除: { "dependencies": {}, "scripts": {
  • Req.body not available in multer.diskStorage(). Error Property body doesn't exist on type 'Request'
    I am trying to save files to local storage using Multer and what I want to do is specify the file name based on the fields in req.body. Basically, the filename should be something like contractorId-projctId. But VS Code shows the error that body property is not defined on req and when I send the file it saves it as undefined-undefined.png. Here is a screenshot of my code. I've added this screen shot to highlight the fact that VS Code is screaming about req.body. Here is the code for uploadFiles.js // @ts-check import express from 'express'; import bodyParser from 'body-parser'; import router
  • 使用ECMAScript 6(Using ECMAScript 6)
    问题 我正在寻找一种在浏览器的控制台中运行ECMAScript 6代码的方法,但是大多数浏览器不支持我正在寻找的功能。 例如,Firefox是唯一支持箭头功能的浏览器。 有没有办法(扩展名,用户脚本等)在Chrome上运行这些功能? 回答1 在Chrome浏览器中,大多数ES6功能都隐藏在名为“实验JavaScript功能”的标记后面。 访问chrome://flags/#enable-javascript-harmony ,启用此标志,重新启动Chrome,您将获得许多新功能。 V8 / Chrome中尚未实现箭头功能,因此此标志不会“解锁”箭头功能。 由于箭头功能是一种语法更改,因此不更改JavaScript解析方式就不可能支持该语法。 如果您喜欢在ES6中进行开发,则可以编写ES6代码并使用ES6-to-ES5编译器来生成与所有现有(现代)浏览器兼容的JavaScript代码。 例如,请参阅https://github.com/google/traceur-compiler。 在撰写本文时,它支持ES6的所有新语法功能。 连同答案顶部提到的标志,您将非常接近所需的结果。 如果要直接从控制台运行ES6语法,则可以尝试覆盖控制台的JavaScript评估程序(例如,在执行代码之前运行Traceur预处理程序)。 如果您愿意这样做,请查看此答案以了解如何修改开发人员工具的行为。
  • Visual Studio在编辑器中不显示编译时错误(Visual Studio not displaying compile time errors in editor)
    问题 例如,当我写: string x = "turtle"; x.Go(); 没有红色的波浪线检测到String上缺少Go()方法。 仅当我编译时,才会检测到错误。 我刚刚升级到Windows 7,我安装了Visual Studio 2008。 在我的旧环境中,在实际编译之前就已检测到错误。 是否有我缺少的设置? 编辑:检查“工具->选项->文本编辑器-> C#->编辑器中的下划线错误”。 我没有“实时语义”选项。 也许我需要转到SP1? 回答1 您需要在编辑器中打开下划线错误,并在Visual Studio中显示实时语义错误选项。 这些选项可以在这里找到: Tools > Options > Text Editor > C# > Advanced > Editor Help 编辑:您需要安装SP1才能使用此功能。 回答2 选择工具->选项,然后选择文本编辑器。 在您使用的语言(例如C#)下,转到“高级” ,并确保已选中编辑器中的“下划线”错误和“显示实时语义错误” 回答3 对于Visual Studio 2015及更高版本: 转到: Tools > Options > Text Editor > C# > Advanced > Editor Help 然后选择: Enable Full solution analysis 回答4 停止项目。 打开文件夹项目。 删除.vs文件夹
  • 我现在如何编写和测试ECMAScript 6代码?(How can I write and test ECMAScript 6 code now?)
    问题 我想开始使用最新的ECMAScript 6(ES6)编写代码,以便开始使用新语法。 是否可以使用某种Web资源或浏览器插件来播放(编写和测试代码)有关我们目前有关ES6的内容? 导致我相信使用Google Chrome Canary可能会有所帮助。 因此,我下载了Canary,并在Canary中启用了几个功能: 启用实验性JavaScript (Mac,Windows,Linux,Chrome OS,Android) 使网页能够使用实验性JavaScript功能。 #enable-javascript-harmony启用 在for循环中测试let块作用域之后 for (let i = 0; i < 10; i++) { console.log(i); } 我收到语法错误: 语法错误:意外的标识符 回答1 在启用了实验性JavaScript标志的Chrome 37(当前的Chrome)中,以下代码适用: (function () { "use strict"; for (let i = 0; i < 10; i++) { console.log(i); } })() 在严格模式之外,您应该看到SyntaxError: Illegal let declaration outside extended mode或者如果您不在严格模式下,则看到SyntaxError
  • 如何禁用:[js] 文件是一个 CommonJS 模块; 它可以转换为 ES6 模块(How do I disable: [js] File is a CommonJS module; it may be converted to an ES6 module)
    问题 以下是我要禁用的内容: 我在设置里找不到。 帮助表示赞赏,因为这真的很烦人。 回答1 这是 Visual Studio Code 中添加的一项新功能,称为“建议代码操作”。 “建议代码操作”在 JavaScript 和 TypeScript 中默认启用。 您可以通过在您的用户/工作区设置中设置: "typescript.suggestionActions.enabled": false或"javascript.suggestionActions.enabled": false来禁用它们。 文档可以在这里找到。 (图片由 Yusuf Yaşar 提供。) 回答2 对于使用带有 coc.nvim 的 Vim 的任何人,您可以通过在:CocConfig对象中添加相同的内容来进行相同的更改: "javascript.suggestionActions.enabled": false 如果您之前没有向:CocConfig添加任何设置,那么您需要确保将上述设置包装在一个 JSON 对象中: { "javascript.suggestionActions.enabled": false } 回答3 实际上,这个烦人的建议来自 TypeScript。 因此,要关闭此建议,您可以修改 TypeScript 的源代码,编译它,然后告诉 vscode 使用您的 TypeScript 分支。
  • ['type aliases' 只能在 .ts 文件中使用](['type aliases' can only be used in a .ts file])
    问题 我使用命令 react-native init "name project" 然后打开 vscode 似乎有错误消息代码。 (图像) 回答1 这就是你需要用VS Code做的,仔细观察gif Steps to resolve error 1. Go to extension 2. Click on more (...) and select Show Built-in extension 3. Search "TypeScript and JavaScript Language Features" - yellow & blue icon 4. Click on Setting icon of extension and select Disable (workspace) 5. Click on Reload / Restart Required 回答2 如果你在 React Native 中得到这个,它可能是 VSCode 中的一个已知错误,当​​ Google Flow(与 MS Typescript 竞争)被编码时,会显示错误地提到 Typescript 的错误。 您当前的 .js 代码应该由 Flow 预处理到另一个带有“适当”js 的 .js 文件中。 因此,请确保安装了 Flow,然后禁用 Typescript 解析支持。 以下是 Flow 安装网页上的官方回答
  • 尽管启用了实验性 js,但 ECMA 6 不起作用(ECMA 6 Not working although experimental js is enabled)
    问题 我有最新的 Chrome 版本(45 和版本 47 的 Chrome Canary),两者都启用了实验性 Javascript 标志。 我想使用 ECMA6,但它不起作用。 我不知道为什么。 是否也必须启用任何技巧或其他标志? ECMA6 的每个保留字(如导入、类或其他)在 Chrome 45 中抛出“未捕获的语法错误:意外的保留字”错误,在 Chrome Canary 中抛出“未捕获的语法错误:意外的令牌导入”错误。 我将不胜感激任何帮助。 而且,因为我几个月前问过这个问题,但没有得到任何答案,但“可能重复”使用 ECMAScript 6 ,所以它不是。 它不能解决我的问题。 谢谢。 --- 编辑 --- 我想使用模块,因为与使用 Require 或 Common 相比,我更喜欢 ecma6 模块。 而且我也喜欢类的糖语法,代码看起来更好:) 回答1 任何浏览器均不支持模块。 您将需要使用诸如 Traceur 或 Babel 之类的转译器。 查看以下内容之一以帮助您入门: 立即选择 ES6 模块! ES6 深入:今天在 Babel 和 Broccoli 中使用 ES6 使用 webpack 编写客户端 ES6 至于类,您可以在本机使用它们而无需通过转译器。 您可以在此处查看兼容性表,以了解当今哪些浏览器原生支持类: https://kangax.github.io