输入C3和D3时的Typescript编译错误

我正在使用Ionic2/Angular2 typescript项目中的图形库C3。我已经通过npm安装了C3，并通过tsd安装了类型定义。输入C3和D3时的Typescript编译错误

我已经如下导入时到我自己的TS文件..

import {Component} from '@angular/core'; 
import {NavController} from 'ionic-angular'; 
import * as C3 from 'c3'; 
import * as D3 from 'd3'; 

@Component({ 
    templateUrl: 'build/pages/graphs-page/graphs-page.html' 
.... 
})

全部显示正常。我可以看到C3（和依赖D3）的类型，并且当我运行一切似乎工作。

然而，当应用程序构建（当我运行ionic serve），我总是得到以下打字稿编译错误......

TypeScript error: D:/dev/ionic2/testcomonents/app/pages/graphs-page/graphs-page.ts(3,21): Error TS2307: Cannot find module 'c3'. 
TypeScript error: D:/dev/ionic2/testcomonents/app/pages/graphs-page/graphs-page.ts(4,21): Error TS2307: Cannot find module 'd3'.

有没有人有，为什么我在编译的时候收到这些错误的任何想法，当我在IDE中没有发现错误时（我正在使用vscode），并且一切似乎都正常工作？

[编辑]

因为我已经安装typescipt 2并与--traceResolution标志运行。我可以看到tsc似乎只在node_modules的各个级别下看起来并且从不看typings文件夹，这是vscode正在查找的位置。

更令人困惑的是（对我而言）是如何包含c3.js源代码，当它位于node_modules/c3文件夹下时。我没有特别添加任何对c3.js的引用，但图表显示出来。

在tsconfig.json的设置

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true 
}, 

"filesGlob": [ 
    "**/*.ts", 
    "!node_modules/**/*" 
], 
"exclude": [ 
    "node_modules", 
    "typings/main", 
    "typings/main.d.ts" 
    ], 
"compileOnSave": false, 
"atom": { 
    "rewriteTsconfig": false 
} 
}

我曾尝试过各种编辑在上面tsconfig.json，但不能让它在分型文件夹的样子。

所以我的问题现在已经成为

如何使Typscript看在分型文件夹
如何设在实际c3.js文件node_modules \ C3 \ c3.js得到列入离子（因为我没有在任何地方添加引用）

来源

2016-07-24 peterc

我在两种情况下得到了这个错误。首先，编译器找不到类型。其次，编译器无法找到模块本身。我对'vscode'不是很熟悉。你知道它是否在使用SystemJS或者是否有其他模块解析方法吗？ – Pace

我发现了一种有助于调试这种问题的技术。如果你升级到TypeScript 2.0，那么你可以从命令行'tsc --traceResolution'运行，它将打印出无处不在，它正在寻找你的js。它还会打印出类似“找到js但没有发现类型”的字样，表明这些类型不在你的道路上。 – Pace

@空间感谢以上。我将开始安装Typescript 2.0，并查看是否可以获取任何额外的信息。至于模块系统，我不确定....我发现声明“在Ionic 2中，我们可以使用ES6进口的魔法”。 – peterc

我想我现在知道这个答案，但如果我不正确，请纠正我！

看在离子文件D:\dev\ionic2\testcomponents\node_modules\ionic-gulp-browserify-typescript\index.js，有下列的SRC属性

var defaultOptions = { 
    watch: false, 
    src: ['./app/app.ts', './typings/main.d.ts'],

所以如果我添加以下main.d.ts

/// <reference path="globals/c3/index.d.ts" /> 
/// <reference path="globals/d3/index.d.ts" />

错误消失。

如果我运行tsc --traceResolution我仍然看到错误，但我的猜测是从命令行运行tsc不包括看上面的Ionic脚本或main.d.ts。

要使用tsc --traceResolution时摆脱错误的，我尝试添加以下的文件D:\dev\ionic2\testcomponents\node_modules\c3\package.json

"typings": "../../typings/globals/c3/index.d.ts",

，然后做同样的事情d3。但是，这则引起以下错误，当我运行离子建立

TypeScript error: d:/dev/ionic2/testcomponents/app/pages/graphs-page/graphs-page.ts(3,21): Error TS2656: Exported external package 
typings file 'd:/dev/ionic2/testcomponents/typings/globals/c3/index.d.ts' is  not a module. Please contact the package author to update the package definition.

所以，我认为在离子背景下，做正确的事情是///路径添加到main.d.ts文件。

我有另一个问题，即如何包含c3.js等文件，这是Browserfity/gulp构建的所有部分，并且这将检查nodes_modules文件夹下的所有内容。他们都有packeage.json文件，在c3的情况下，我们有"main": "c3.js"行。

来源

2016-08-14 01:28:25 peterc

输入C3和D3时的Typescript编译错误

回答

相关问题