我在尝试
$(function(){
alert('Hello');
});
Run Code Online (Sandbox Code Playgroud)
它在Visual Studio中显示此错误:(TS) Cannot find name '$'.
.如何在TypeScript中使用jQuery?
在JavaScript中,我可以这样做:
something = 'testing';
Run Code Online (Sandbox Code Playgroud)
然后在另一个文件中:
if (something === 'testing')
Run Code Online (Sandbox Code Playgroud)
它将something
被定义(只要它们以正确的顺序被调用).
我似乎无法弄清楚如何在TypeScript中做到这一点.
这就是我尝试过的.
在.d.ts文件中:
interface Window { something: string; }
Run Code Online (Sandbox Code Playgroud)
然后在我的main.ts文件中:
window.something = 'testing';
Run Code Online (Sandbox Code Playgroud)
然后在另一个文件中:
if (window.something === 'testing')
Run Code Online (Sandbox Code Playgroud)
这很有效.但我希望能够失去window.
它的一部分,让我的something
全球化.有没有办法在TypeScript中做到这一点?
(如果有人感兴趣,我真的想为我的应用程序设置日志记录.我希望能够log.Debug
从任何文件调用而无需导入和创建对象.)
在我的例子中,我正在尝试扩展TS Window接口以包含polyfill fetch
.为什么无所谓.问题是" 我怎么告诉TS这window.fetch
是一个有效的函数? "
我在运行TS v.1.5(IIRC)的VS Code,v.0.3.0中这样做.
在我想要使用它的TS类文件中声明接口不起作用:
///<reference path="typings/tsd.d.ts"/>
interface Window {
fetch:(url: string, options?: {}) => Promise<any>
}
...
window.fetch('/blah').then(...); // TS objects that window doesn't have fetch
Run Code Online (Sandbox Code Playgroud)
但是如果我在一个单独的".d.ts"文件中声明这个相同的接口并在我的TS类文件中引用它,那就没关系.
这是"typings/window.extend.d.ts"
///<reference path="es6-promise/es6-promise"/>
interface Window {
fetch:(url: string, options?: {}) => Promise<any>
}
Run Code Online (Sandbox Code Playgroud)
现在我可以在我的TS类文件中使用它:
///<reference path="typings/window.extend.d.ts"/>
...
window.fetch('/blah').then(...); // OK
Run Code Online (Sandbox Code Playgroud)
或者,我可以在我的TS类文件中使用另一个名称编写扩展接口,然后在强制转换中使用它:
interface WindowX extends Window {
fetch:(url: string, options?: {}) => Promise<any>
}
...
(<WindowX> window).fetch('/blah').then(...); // OK
Run Code Online (Sandbox Code Playgroud)
为什么扩展接口工作在"d.ts"而不是就地? …
我正在使用依赖于专有财产的navigator.id
人物角色.由于此属性不是标准属性,因此TypeScript编译器会生成以下警告:
$ tsc home.ts --out my_ts_generated_code.js
/Users/..../home.ts(27,18): The property 'id' does not exist on value of type 'Navigator'
Run Code Online (Sandbox Code Playgroud)
但.js文件已成功生成并在FF15浏览器上运行,没有任何警告/错误消息.
我还navigator.id
按照文档的说明包含了一个polyfill ,因此navigator.id
肯定会在每个浏览器中提供.
有人可以建议我如何处理这个警告吗?
的index.html
<!-- some HTML omit above -->
<script src="https://login.persona.org/include.js"></script>
<script src="my_ts_generated_code.js"></script>
<button class="btn" id="signin">Sign in</button>
<button class="btn" id="signout">Sign out</button>
<!-- some HTML omit below -->
Run Code Online (Sandbox Code Playgroud)
home.ts
declare var $;
class Student {
fullname : string;
constructor(public firstname, public middleinitial, public lastname) {
this.fullname = firstname + " " + middleinitial + …
Run Code Online (Sandbox Code Playgroud) 我在index.tsx上收到此错误。
属性“ REDUX_DEVTOOLS_EXTENSION_COMPOSE ”在类型“窗口”上不存在。
这是我的index.tsx代码:
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import App from './App';
import './index.css';
import registerServiceWorker from './registerServiceWorker';
import { Provider } from 'react-redux';
import { createStore, compose, applyMiddleware } from 'redux';
import rootReducer from './store/reducers';
import thunk from 'redux-thunk';
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(rootReducer, composeEnhancers(
applyMiddleware(thunk)
));
ReactDOM.render( <Provider store={store}><App /></Provider>, document.getElementById('root'));
registerServiceWorker();
Run Code Online (Sandbox Code Playgroud)
我已经安装了@ types / npm install --save-dev redux-devtools-extension,并且正在使用create-react-app-typescript。非常感谢您提前进行的提示。
typescript reactjs redux react-redux redux-devtools-extension
我使用Webpack + html-webpack-plugin来构建我的所有静态文件.问题是,当我使用谷歌地图API时,它不起作用.
我有这个代码:
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 6
});
// the other code, irrelevant
}
Run Code Online (Sandbox Code Playgroud)
还有一个HTML文件:
<!doctype html>
<html>
<head>
</head>
<body>
<div id="map"></div>
<script async="async" defer="defer"
src="https://maps.googleapis.com/maps/api/js?key=<token here>&callback=initMap">
</script>
<script src="script.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
如果我只运行这个文件,一切正常.但是,如果我运行它,webpack就会抱怨'initMap不是一个函数'.我查看了输出内部,似乎initMap被声明为不是全局函数,而是作为模块内部的函数或类似的东西,所以也许这就是问题.
我应该如何在webpack中使用Google Maps API?我知道我可以用我的脚本捆绑一些libs,比如反应,我应该这样做吗?这里的方法应该是什么?
UPD:这是我的webpack.config.js:
/* eslint-disable */
const path = require('path')
const fs = require('fs')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const nodeModules = {}
fs.readdirSync('node_modules')
.filter(function(x) {
return ['.bin'].indexOf(x) …
Run Code Online (Sandbox Code Playgroud) 我有一个下面定义的全局js变量(@Url是一个ASP.Net MVC html帮助器,它将转换为字符串值):
<script>
var rootVar = '@Url.Action("Index","Home",new { Area = ""}, null)';
System.import('app').catch(function(err){ console.error(err); });
</script>
Run Code Online (Sandbox Code Playgroud)
如何在angular2组件中访问rootVar?我曾经在角度1.5中使用窗口服务,在angular2中有类似的方法吗?
具体来说,我想使用该rootVar变量来帮助生成此组件中的templateUrl:
import { Component, Inject} from '@angular/core';
@Component({
selector: 'home-comp',
templateUrl: '../Home/Root'
})
export class HomeComponent {
constructor( ) { }
}
Run Code Online (Sandbox Code Playgroud) 我正在从Google 登录平台迁移到较新的Google Identity Services 库。
应用程序.svelte:
<svelte:head>
<script src="https://accounts.google.com/gsi/client" async defer></script>
</svelte:head>
<div id="g_id_onload"
data-client_id="x.apps.googleusercontent.com"
data-callback="handleCredentialResponse">
</div>
<div class="g_id_signin"
data-type="standard"
data-size="large"
data-theme="outline"
data-text="sign_in_with"
data-shape="rectangular"
data-logo_alignment="left">
</div>
Run Code Online (Sandbox Code Playgroud)
<script>
function decodeJwtResponse(token) {
let base64Url = token.split('.')[1]
let base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
let jsonPayload = decodeURIComponent(atob(base64).split('').map(function(c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload)
}
let responsePayload;
function handleCredentialResponse(response) {
// decodeJwtResponse() is a custom function defined by you
// to decode the credential response. …
Run Code Online (Sandbox Code Playgroud) 当我点击按钮时,我应该发送到数据层信息,但我不知道该怎么做,因为我使用的是 Angular 6,所以我需要使用 Typescript 和 window.dataLayer.push 不工作并给我这个错误
形式
<form>
<div class="radio">
<input value="Yes" id="radio-1" [(ngModel)]="answer" name="radio" type="radio">
<label class="radio-label rob-l" for="radio-1">Yes</label>
</div>
<div class="radio">
<input value="No" id="radio-2" [(ngModel)]="answer" name="radio" type="radio">
<label class="radio-label rob-l" for="radio-2">No</label>
</div>
</div>
<div class="btn">
<button (click)="Next()" type="submit">Next question</button>
</div>
</form>
Run Code Online (Sandbox Code Playgroud)
我想收到这样的消息
Next(){
if ((this.path == 1) && (this.answer === "Yes" || this.answer === "No"))
{
// window.dataLayer = window.dataLayer || [];
// window.dataLayer.push({
// 'event': 'answer',
// 'answer': this.answer
// });
this.path++;
this.answer = "";
} …
Run Code Online (Sandbox Code Playgroud) 我正在尝试使用 Node/Express 应用程序转向打字稿。以前我的代码是:
//app.js
const error = new Error('Not Found');
error.status = 404;
Run Code Online (Sandbox Code Playgroud)
当我尝试这个时:
//app.ts
const error = new Error('Not Found');
error.status = 404; // Property 'status' does not exist on type 'Error'.ts(2339)
Run Code Online (Sandbox Code Playgroud)
我从developer.mozilla.org 文档中了解到,Error 构造函数具有以下可选参数:message
、options
、fileName
、lineNumber
- 所以我想status
不应该允许?我想我是从 YouTube 教程中复制的,所以我想这实际上不是一个好的做法?
typescript ×8
angular ×2
javascript ×2
data-layers ×1
express ×1
fetch-api ×1
google-maps ×1
jquery ×1
node.js ×1
react-redux ×1
reactjs ×1
redux ×1
svelte ×1
webpack ×1