Webpack输出编译打字稿为(javascript)string

有谁知道如何输出编译打字稿作为可以使用Extract-Text-Webpack-Plugin提取的string?

目前我使用“ts-loader”将TypeScript文件转换为JavaScript文件。 但是,结果并不如预期的那样,因为输出JavaScript与将由NodeJs执行的Js集成在一起。

预期的结果是将TypeScript内容编译为JavaScriptstring,就像Css加载程序所做的一样,所以我可以使用Extract-Text-WebPack-Plugin将编译后的JavaScript内容呈现到输出文件中(一个捆绑的js文件,将用作一个浏览器端JavaScript库)。

不知道哪个webpack插件/加载程序能够解决这个问题?

webpack.config.js

var webpack = require("webpack"); var ExtractTextPlugin = require("extract-text-webpack-plugin"); var exCss = new ExtractTextPlugin('[name].bundle.css'); var exScss = new ExtractTextPlugin('[name].bundle.css'); module.exports = { entry: { entry:"./src/entry.js" }, devtool: "source-map", output: { path: __dirname + "/bundle", publicPath: "/assets/", filename: "[name].bundle.js" }, resolve: { // Add `.ts` and `.tsx` as a resolvable extension. extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js', '.jsx'] }, module: { loaders: [ { test:/\.ts$/, loader: "ts-loader" }, { test: /\.css$/, loader: exCss.extract(["css"]) } ] }, plugins: [exScss, exCss] }; 

tsconfig.json

  { "compilerOptions": { "target": "es5", "module": "commonjs", "moduleResolution": "node", "sourceMap": true, "emitDecoratorMetadata": true, "experimentalDecorators": true, "removeComments": true, "noImplicitAny": false }, "exclude": [ "node_modules", "typings" ] } 

TypeScript文件:test.ts

 class FirstType{ firstProp: "ok"; } let obj = new FirstType(); console.log(obj.firstProp); 

预期结果:test.bundle.js

 "use strict"; var FirstType = (function () { function FirstType() { this.firstProp = "ok"; } return FirstType; }()); var obj = new FirstType(); console.log(obj.firstProp); 

不需要的实际结果:test.bundle.js

 /******/ (function(modules) { // webpackBootstrap 

……

 function(module, exports) { "use strict"; var FirstType = (function () { function FirstType() { this.firstProp = "ok"; } return FirstType; }()); var obj = new FirstType(); console.log(obj.firstProp); } ]); 

您可以通过使用自定义的加载程序来实现。

 module.exports = function(source){ var src = source; src = src.replace(/\\/ig, "\\\\"); src = src.replace(/\'/ig, "\\'"); src = src.replace(/\"/ig, "\\\""); src = src.replace(/\r/ig, "\\r"); src = src.replace(/\n/ig, "\\n"); return 'var content = "'+src+'";module.exports = content;'; };