我正在使用webpack来处理和捆绑我的TypeScript模块,但我需要从外部获得一些模块/块。我该怎么做?
其他信息
代码分为不同的目录,每个页面(/ component)一个。每个页面包含多个文件,每个文件包含一个模块。它看起来像这样:
js/
├ page1/
| ├ entry.ts
| ├ module1.ts
| └ module2.ts
├ page2/
| ├ entry.ts
| ├ module3.ts
| └ module4.ts
TypeScript模块定义为
import {Module2} from "./module2";
export module Module1 {
export function someFunc():int {
return Module2.someVal;
}
}
我正在使用gulp-webpack来编译和捆绑每个页面的模块:
gulp.task('javascript', function () {
return gulp.src('src/js/**/entry.ts')
.pipe(named(function (file) {
// Sets file.named to the containing directory name (used by webpack)
return path.dirname(file.path).substr(path.dirname(file.path).replace(/\\/g, '/').lastIndexOf('/') + 1);
}))
.pipe(webpack({
resolve: {
extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
},
module: {
loaders: [
{test: /\.tsx?$/, loader: 'ts-loader'}
]
},
plugins: [
new CommonsChunkPlugin({
name: "bundle",
minChunks: 3
})
],
output: {
filename: '[name].js'
},
devtool: 'source-map'
}))
.pipe(gulp.dest('dest/js'))
});
现在我需要可以从全局范围访问Module1.someFunc()
,因此它可以被其他(外部)组件使用。我查看了expose loader,但我不知道在这种情况下它是如何工作的。
任何帮助将不胜感激!
答案 0 :(得分:0)
我想出了如何用暴露加载器来做到这一点。在一个entry.ts我用过:
import x = require("expose-loader?M1!./module1");
通过M1.Module1.someFunc()
从外部使该功能可用。我的IDE和gulp-webpack都犯了一个错误,但最后它仍然以某种方式工作。对我来说足够好了!