TypeScript 2.1.4打破了webpack ts-loader中的变化

时间:2016-12-22 04:07:52

标签: typescript gulp webpack tsc ts-loader

从Typescript 2.0.10升级到2.1.4似乎打破了webpack,webpack-stream,ts-loader或gulp中的某些东西,因为它不再尊重我的入口点或gulp源glob。它似乎包括我项目中的所有.ts文件(包括/ server源文件夹中的文件),而不仅仅是gulp.src和web pack入口点中/ client和app.ts中的ts文件。是否有不同/更新/更好的方式我应该这样做?

在gulp文件中:

import React, { Component } from 'react';

import StartMultiple from './Start.multiple.js';

export default class Start extends Component {
    constructor()
    {   
        super();
        this.state = {count: 4}; 
        this.count = 4;
        this.repeats = [ 
            <StartMultiple key="1"/>,
            <StartMultiple key="2"/>,
            <StartMultiple key="3"/>
        ];  

    }   

    add_repeat(e)
    {   
        this.repeats.push(<StartMultiple key={this.count}/>);
        this.count = this.count + 1;
        console.log(this.repeats);
    }   

    render()
    {   
        var count = 1;

        return(
            <div>
                {this.repeats}

                <button onClick={ () => this.add_repeat(event)}>clickable</button>
            </div>
        );  
    }   
}

在网络包配置中:

const serverPath = 'server';
const clientPath = 'client';
const buildPath = 'build';
const paths = {
    server: {
        scripts: [
            `${serverPath}/**/*.ts`
        ]
    },
    client: {
        files: [
            `${clientPath}/**/*`
        ],
        scripts: [
            `${clientPath}/**/*.ts`
        ],
        entry: `${clientPath}/app.ts`
    }
};


gulp.task('build:client', cb => {
    gulp.src(paths.client.entry)
        .pipe(webpackStream(webpackConfig, webpack))
        .pipe(gulp.dest(`${buildPath}/${clientPath}`));
    cb();
});
tsconfig.json中的

entry: {
    app: './client/app.ts'
}

ts: {
    configFileName: './tsconfig.json'
}

resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
}

module: {
    loaders: [
        { test: /\.ts$/, loader: 'ng-annotate-loader!ts-loader' }
    ]
}

使用2.0.10输出:

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "removeComments": false,
        "noImplicitAny": true,
        "sourceMap": true,
        "inlineSources": true,
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true
    }
}

使用2.1.4输出:

ts-loader: Using typescript@2.0.10 and /Users/chris/code/class-app/tsconfig.json
[20:47:36] Version: webpack 1.14.0
Asset       Size  Chunks             Chunk Names
app.js.map  950 bytes       0  [emitted]  app
app.js  550 bytes       0  [emitted]  app

1 个答案:

答案 0 :(得分:2)

显然问题是WebPack中的TypeScript一直在服务器代码上运行(虽然它不应该)但是我已经计划修复升级TypeScript引入的服务器TS问题,它真的是什么暴露是WebPack正在编译它不应该一直没有的文件。通过故意在上一个(&#34;工作&#34;)版本的TypeScript上向服务器ts引入问题来测试它,得到相同的错误。

我仍然需要弄清楚为什么它会尝试编译我的所有TS文件,而不仅仅是/ client中的文件,但我会问一个新的问题。