Karma，Typescript定义文件未加载
Karma，Typescript定义文件未加载
提问于 2017-08-26 21:06:05
我正在使用karma，webpack和typescript建立开发环境，但我有一个关于karma没有在测试中应用自定义定义文件的问题。
这是我的项目文件结构：
// file structure
project/
config/
karma.conf.js
tests/
test-files.ts
...
src/
tsdefinitions.d.ts
other-ts-files.ts
...
tsconfig.json这里是与webpack和typescript相关的业力配置部分
webpack: {
devtool: 'eval-source-map',
resolve: {
extensions: ['.webpack.js', '.web.js', '.ts', '.tsx', '.js']
},
module: {
loaders: [{
test: /\.tsx?$/,
loader: 'awesome-typescript-loader'
}]
}
},
webpackMiddleware: {stats: 'errors-only'},
mime: {'text/x-typescript': ['ts','tsx']},
basePath: '../',
files: [{
pattern: './test/**/*.ts',
watched: false
}],
preprocessors: {
'./test/**/*.ts': ['webpack', 'sourcemap']
}最后是tsconfig.json
{
"compilerOptions": {
"removeComments": true,
"allowSyntheticDefaultImports": true,
"baseUrl": "./",
"sourceMap": true,
"noImplicitAny": true,
"allowJs": true,
"module": "commonjs",
"target": "es2015",
"paths": {
"jquery": ["node_modules/jquery/dist/jquery"]
},
"exclude": ["node_modules"],
"files": [
"src/**/*.ts"
]
},
"awesomeTypescriptLoaderOptions": {
"useCache": false,
"useBabel": true,
"babelOptions": {
"presets": [
"es2015",
"stage-0"
]
}
}
}我像这样运行因果报应测试
./node_modules/.bin/karma start ./config/karma.conf.js现在，当我使用karma构建项目文件时，一切都很好，它们是没有错误地构建的。
但是当我运行测试构建时，有很多关于在tsdefinitions.d.ts文件中声明的窗口界面属性丢失的错误。
回答 1
Stack Overflow用户
发布于 2019-03-04 04:51:26
通过将类型与源文件放在不同的文件夹中，并使用typeRoots字段将其包含在tsconfig.json中，我可以做到这一点。
我的tsconfig.json
{
"compilerOptions": {
...
"typeRoots": [
"./@types"
]
},
"include": [
"src/**/*.ts"
],
"exclude": [
"src/**/*.test.ts"
]
}karma.config.js：
const webpackConfig = require("./webpack.test");
module.exports = function(config) {
config.set({
basePath: "",
frameworks: ["mocha", "chai"],
plugins: [
"karma-chai",
"karma-chrome-launcher",
"karma-mocha",
"karma-mocha-reporter",
"karma-sourcemap-loader",
"karma-webpack"
],
files: [
"src/**/*.test.ts"
],
exclude: [],
webpack: webpackConfig,
preprocessors: {
"**/*.ts": ["webpack", "sourcemap"]
},
mime: { "text/x-typescript": ["ts", "tsx"] },
...
});
};现在我可以为没有任何类型的模块定义类型，如下所示：
@types/universal-url/index.d.ts
declare module 'universal-url' {
export {URL, URLSearchParams} from 'whatwg-url'
export function shim(): void
}和我的src/utils/parseUrl.ts文件：
import { URL } from 'universal-url'
export function parseUrl(url: string) {
return new URL(url)
}同样，关键是tsconfig.json的typeRoots字段。下面是文档：https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#types-typeroots-and-types
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45895704
复制相关文章
相似问题
腾讯云开发者
