问题标签 [ts-loader]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
4380 浏览

typescript - 通过 webpack 2 和 typescript 使用 globalize

我正在尝试在 TypeScript 项目中使用带有webpack 2的Globalize 库。typescript/Webpack 2 设置已经工作,但是,在导入和访问 Globalize 时,我在运行 webpack 时收到以下错误消息:

所以我尝试安装全球化类型:

现在我收到以下错误:

不幸的是,这对我来说都是全新的。不知道我是否应该检查 webpack 或 typings 或 globalize 或 typescript ...

这是我的 package.json:

和 index.ts:

完整的项目文件(包括 webpack-config)可在此 github 存储库中找到。

注意:这个问题是在尝试解决我之前提出的问题时出现的。如果这可行,它也可以解决我之前的问题。

0 投票
2 回答
1337 浏览

javascript - 使用 webpack 优化 Angular 2 应用程序构建持续时间

我构建了一个 Angular 2 应用程序并将其与 webpack 捆绑在一起。目前,我的应用程序仍然很小,但 webpack 任务已经花费了大约 10 秒。是否可以优化我的 webpack 配置或 TypeSript 编译选项以提高编译和打包持续时间?

这是我使用的 webpack 配置:

和 tsconfig :

更新 (请参阅我对固定 webpack.config 的回答)

我通过在单独的构建中编译 Angular 来尝试@jpwiddy 建议的 DLL webpack 插件,以便在开发过程中只需要重新构建应用程序代码并获得大量编译时间。

但是查看了输出的js,文件大小还是一样的,里面还是有角码的。

这是 Angular 资源的新 webpack 配置文件:

以及应用程序的更新 webpack 配置:

这是我在我的应用程序 JS 输出中找到的角度代码之一:

我是否错过了新配置中的某些内容以防止 webpack 在输出中包含角度源?

谢谢

0 投票
1 回答
2510 浏览

javascript - webpack 加载器总是在编译中包含 node_modules

我正在使用 webpack 1.13.3,在回答这个问题时,我在底部提供了我的 tsconfig.json。

我的加载器总是包含 node_modules 包,无论我是使用包含、排除还是两者的组合。

网络包配置:

我尝试了各种组合:

1) 仅包含正则表达式/src/或直接path.resolve(__dirname, "src")

/node_modules/2) 仅使用正则表达式或直接排除path.resolve(__dirname, "node_modules")

3)我尝试过同时使用两者includeexclude.

对于node_modules中的文件,我总是从我的ts-loader中收到错误,即:

不知道该怎么做,据我所知,加载器配置中的排除/包含假设是向 webpack 指示包含或排除要转换的文件,如何始终包含 node_modules 文件?

编辑 1: 万一这很重要,这是我的 tsconfig.json

0 投票
4 回答
7029 浏览

typescript - Webpack:“通常”和作为原始字符串导入 TypeScript 模块

使用 webpack ^v2.2.1,除了“正常”导入相同的模块之外,我还想将 TypeScript 模块作为文本导入。

我想我可能应该使用raw-loader。但这行不通。

一些示例代码:

TypeScript 对我大喊大叫,比如

我正在使用ts-loader

这是我的webpack.config.js

0 投票
1 回答
5853 浏览

typescript - 为什么 ts-loader 不编译我的打字稿?

我正在尝试使用 Webpack 使用 ts-loader 编译一些打字稿,但它没有像我预期的那样运行 tsc。如果我对 ts 文件进行更改,webpack 不会将其编译回 js,如果我完全删除生成的 js 文件并重新运行 webpack,也会发生同样的情况。

Typescript 设置得很好,因为我可以运行./node_modules/typescript/bin/tsc它并且它生成的 js 文件就好了。我认为 ts-loader 应该对我的 tsconfig.json 运行 tsc 是否正确?如果是这样,为什么它没有按预期获取更改并生成我的 js?

正如你所看到的,我的入口点是./Client/boot-client.ts在通过 webpack 运行时甚至没有编译。

我正在运行的特定 webpack 命令是:

./node_modules/webpack/bin/webpack.js --progress

这给出了以下输出

版本

  • 网络包:2.3.2
  • ts 加载器:2.0.3
  • 打字稿:2.2.2

webpack.config.js

tsconfig.json

0 投票
1 回答
3229 浏览

angular - angular 2 webpack 2 错误找不到名称“全局”

我正在尝试使用 webpack 2 设置 angular 2,但出现构建错误。

我刚刚导入了 @angular/platform-b​​rowser-dynamic 但它在屏幕上显示了很多错误。找不到模块'错误找不到名称'全局'。是其中之一

C:\Users\T12449\Desktop\angular\hello-angular\node_modules\zone.js\lib\zone-spec\wtf.ts (156,80) 中的错误:错误 TS2304:找不到名称“全局”。

C:\Users\T12449\Desktop\angular\hello-angular\node_modules\zone.js\lib\zone-spec\fake-async-test.ts (268,80) 中的错误:错误 TS2304:找不到名称“全局” '。

C:\Users\T12449\Desktop\angular\hello-angular\node_modules\zone.js\lib\node\node.ts (18,93) 中的错误:错误 TS2304:找不到名称“全局”。

我的 webpack.config.js

包.json

main.ts

tsconfig.json

0 投票
1 回答
2033 浏览

regex - 匹配 *.ts 但不匹配 *.d.ts 的 Webpack 正则表达式测试

我正在使用 Webpack (2.3.3) 在 TS 中构建我的 Aurelia 应用程序。但是,由于我正在使用includeAllAureliaPlugin (2.0.0-rc.2) 的选项,因此 ts-loader (2.0.3) 会抱怨没有任何导出的 d.ts 文件不会发出任何输出。

这是我对 ts 文件的规则:{ test: /\.ts$/, include: /ClientApp/, use: "ts-loader" }

我需要更改测试值,使其与名为 *.ts 的文件匹配,但 *.d.ts 除外。你能帮我吗?

注意:我看到已经有一个类似的正则表达式问题,但是那个对我不起作用。

0 投票
5 回答
53034 浏览

javascript - Webpack 无法解析 TypeScript 模块

我构建了一个中继小型 webpack 和 typescript 演示来玩。如果我使用 webpack.config.js 运行 webpack,我会收到此错误:

我不知道问题可能是什么。模块导出应该是正确的。

文件夹结构

webpack.config.js

tsconfig.json

src/app.js

src/MyModule.ts

src/index.html

0 投票
1 回答
621 浏览

typescript - 其他文件中的环境模块适用于 tsc 但不适用于 webpack + ts-loader?

我正在学习 TypeScript 中的环境模块,使用 MailApp 的一个小玩具示例,它是 Google Apps Script 中的一个全局模块(参见此处)。我正在做的只是用 VS 代码编写我的代码,用 webpack 编译它,然后将其作为 ES5 代码复制到 Apps Script 控制台中运行。

我的问题:对于下面的代码,当我将环境模块声明移出到 .d.ts 文件并使用三斜杠指令来引用它时,TSC 和 VS 代码都可以识别这一点。但是,webpack + ts-loader(awesome-typescript-loader 也有同样的问题)总是显示错误:

我在这里错过了什么吗?

我的声明文件:root/src/AppsScriptTypes.d.ts

我的主文件:root/src/SendMail.ts

我的根/webpack.config.js:

当我不使用三斜杠引用 + 单独文件并将声明移动到 SendMail.ts 文件中时,webpack + ts-loader 没有错误,但这当然不是可取的:

我在某处缺少配置吗?我正在使用 webpack 2.4.1、TypeScript 2.3、ts-loader 2.0.3。谢谢你的帮助!

0 投票
1 回答
1575 浏览

typescript - 编译 TypeScript 并将目标设置为“ES3”或“ES5”内部

刚刚进入 typescript 的世界,并尝试使用 webpack ts-loader 和 babel-loader 将 typescript 编译并转换为 ES5。但后来我看到 tsc 中有一个可以针对“ES5”的编译器选项,我觉得“那我用 babel-loader 做什么?”

所以我的问题是:

  1. 当 typescript 编译器以 ES5 为目标时,内部发生了什么?
  2. 我可以单独使用 ts-loader 和 tsconfig 目标选项来实现我的目标吗?
  3. 如果是这样,哪种方式更好?(ts-loader 到 ES6,然后 babel-loader 到 ES5,或者 ts-loader 将 target 选项设置为 ES5)
  4. 在这两种情况下,摇树(webpack2 功能)会发生什么?