如何从webpacked JS中排除Typescript设置所需的库

Question

感谢您的指导，我们对于深入的Typescript相对较新。诚然，我是一个服务器端的人，但我喜欢Stylcript提供的舒适感觉！感觉在家附近。作为测试案例，我试图将脚本'宝宝步入'已经包含jQuery的主项目中。这个测试用例在其代码中导入jQuery。

import $ = require("jquery"); 

class TestCase { 
    constructor(localeData) { 
     $('body').css('background', 'blue'); 
    } 
} 

这编译（与打字稿）到这个预期的格式

"use strict"; 
Object.defineProperty(exports, "__esModule", { value: true }); 
const $ = require("jquery"); 
class TestCase { 
    constructor(localeData) { 
     $('body').css('background', 'blue'); 
    } 
} 

除此之外，我执行以下命令：

npm install -g webpack

npm install ts-loader --save

而且具有加入这个webpack.config.js

module.exports = { 
    entry: './testcase.ts', 
    output: { 
     filename: 'testcase.js' 
    }, 
    resolve: { 
     extensions: ['.webpack.js', '.web.js', '.ts', '.js'] 
    }, 
    module: { 
     loaders: [ 
      {test: /\.ts$/, loader: 'ts-loader'} 
     ] 
    } 
}; 

我之后运行'webpack'并按照预期的方式获取所有jQuery，然后再运行我的小测试脚本。需要注意的是我想插入这个项目的项目已经包含了jQuery。

我该如何处理这种情况;我想我必须告诉webpack以某种方式排除此导入？

谢谢！

Answer 1

好吧。似乎像这样简单？

module.exports = { 
    entry: './testcase.ts', 
    output: { 
     filename: 'testcase.js' 
    }, 
    resolve: { 
     extensions: ['.webpack.js', '.web.js', '.ts', '.js'] 
    }, 
    externals: { 
     "jquery": "jQuery", 
    }, 
    module: { 
     loaders: [ 
      {test: /\.ts$/, loader: 'ts-loader'} 
     ] 
    } 
};