导入Typescript @types导致browserify出错

问题描述：

我在导入语句中运行browserify时出现错误。我可以在没有它的情况下捆绑它，但然后我得到类型错误。我有几个文件导入类型，但是，当我尝试运行browserify时，我得到导入Typescript @types导致browserify出错

错误：无法从'/ Users/lonniemcgill/Desktop/Projects/Typescript/ssadmin/development/assets中找到模块'chart.js'/TS /视图

我tsconfig看起来是这样的：

{ 
    "files": [ 
     "ts/main.ts" 
    ], 
    "compileOnSave": true, 
    "compilerOptions": { 
     "noImplicitAny": true, 
     "target": "es5", 
     "moduleResolution": "node", 
     "typeRoots": ["./node_modules/@types"], 
     "types": ["jquery", "chart.js"], 
     "sourceMap": true 
    } 
}

和我的进口看起来像这样：

import * as Chart from "chart.js";

Visual Studio代码识别出它是一个类型，因为INTE llisence不给我任何错误。没有导入它会工作，但我得到一堆类型的错误。我如何才能将browserify与包含的导入语句捆绑在一起？

这是我的这个任务的代码。

gulp.task('browserify', function() { 
    return browserify({ 
      basedir: '.', 
      debug: true, 
      entries: ['ts/main.ts'], 
      cache: {}, 
      packageCache: {} 
     }) 
     .plugin(tsify) 
     .transform(babelify, { 
      presets: ['es2015'], 
      extensions: ['.ts', '.js'] 
     }) 
     .bundle() 
     .pipe(source('bundle.js')) 
     .pipe(buffer()) 
     .pipe(sourcemaps.init({ loadMaps: true })) 
     .pipe(uglify()) 
     .pipe(sourcemaps.write('./')) 
     .pipe(gulp.dest("js/compiled")); 
});

您是否正在通过脚本标记加载chart.js？将它作为一个模块加载（首选），或者创建一个'declare global'类型的填充。可能还有一些Browserify具体的方式来映射它。 –

我已将所有的bower组件编译成vendor.js文件并将其加载到脚本标记中。 –

那么这就是为什么 –

答

由于您在价值位置使用导入（而不是单独在类型位置），typescript不会忽略它。这意味着发出的JavaScript有import（作为require转录）。

Browserify将因此尝试从node_modules导入它。

要修正此错误，你有几种选择：

安装chart.js之与NPM
```
npm install --save chart.js  
```
然后从你的供应商捆绑将其删除。

这应该是首选的方法。这是使用Browserify或Webpack等工具的主要原因之一。

为chart.js创建一个全局声明，以便您不必导入它。

import chartjs = require('chart.js'); 
declare global { 
    const Chart = chartjs; 
}

然后删除导入。

使用Browserify特定配置技术来告诉它，chart.js实际上映射到全局。

这个答案说明如何：https://stackoverflow.com/a/23129051/1915893

答

对于那些你们谁是兴趣，我发现了打字稿文件答案。 https://www.typescriptlang.org/docs/handbook/declaration-files/publishing.htmlUse /// <reference types="chart.js" />或任何你的@类型。而不是导入，以便它与打字稿兼容。

导入Typescript @types导致browserify出错

相关推荐