使用Typescript和Webpack捕获SVG错误“无法读取未定义的属性”

Question

我有一个使用Snap SVG的Angular 4应用程序，我得到了dredded webpack问题“无法读取未定义的属性”。

使用snapsvg-cjs似乎是修复此问题的最简单方法，但后来我丢失了所有不错的打字稿类型（在此回答：Typescript library for SVG）。

有一些关于使用import-loader的讨论但是我需要一个web pack配置，而角度cli则需要它。另外：

import Snap from 'imports-loader?this=>window,fix=>module.exports=0!snapsvg/dist/snap.svg.js';

不会在打字稿中编译。

我对所有这些东西都很陌生，所以感觉有些困惑 - 我希望我再次回到Windows上做VB6 .... :)。任何人都可以澄清这个吗？

由于

Answer 1

好的，我看到我现在做了什么。使用snapsvg-cjs就行了。我得到打字稿支持。

Answer 2

我有同样的问题。对我来说，我安装了snapsvg-cjs和@types/snapsvg，然后按以下方式导入了库：

import "snapsvg-cjs"

您只需一次以这种方式导入它（也许在main.ts文件中或类似的东西中）

然后在要使用库的文件中，按如下所示导入类型：

import * as SNAPSVG_TYPE from "snapsvg"
declare var Snap: typeof SNAPSVG_TYPE

这使我能够像平常一样使用打字稿类型，同时仍然使用与Webpack兼容的版本。