0

将 TypeScript (2.3.2) 和 Webpack 2 与 ts-loader 和 babel-loader 一起使用。

我正在尝试为某些模块创建代码拆分,但我注意到我的require.ensure(...)编译为Promise.resolve().then(function(require) {})并且未创建块文件。

例子:

(一些 .ts 文件)

"use strict";

require.ensure(['./components/MyComp'], function (require) {

    let Comp = require('./components/MyComp');

    console.log(Comp);

}, "myComp");

以及编译后的代码:

Promise.resolve().then((function (require) {

    var Comp = __webpack_require__(56);

    console.log(Comp);
}).bind(null, __webpack_require__)).catch(__webpack_require__.oe);

以下是我的一些设置:

tsconfig.json

{
"version": "2.3.2",
"compilerOptions": {
    "baseUrl": "src/",
    "target": "es5",
    "module": "commonjs",
    "allowJs": false,
    "allowSyntheticDefaultImports": false,
    "preserveConstEnums": true,
    "sourceMap": true,
    "moduleResolution": "node",
    "lib": [
        "es6",
        "es7",
        "dom"
    ],
    "types": [
        "webpack-env",
        "inferno"
    ],
    "jsx": "preserve",
    "noUnusedLocals": true,
    "strictNullChecks": false,
    "removeComments": false
},
"include": [
    "src/**/*"
],
"exclude": [
    "node_modules",
    "webpack"
],
"files": [
    "src/index.d.ts"
],
"compileOnSave": false
}

webpack.config.js(模块部分)

module: {
    loaders: [
        {
            test: /\.tsx?$/,
            loaders: ['babel-loader', 'ts-loader'],
            exclude: /node_modules/
        }, {
            test: /\.jsx?$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        }, {
            test: /\.scss$/,
            loaders: ['style-loader', 'css-loader?sourceMap', 'sass-loader'],
            exclude: /node_modules/
        }
    ]
},

知道为什么吗?我尝试在https://github.com/TypeStrong/ts-loader/tree/master/test/comparison-tests/codeSplitting进行实施,但没有成功。

4

0 回答 0