如何通过webpack导入bootstrap?

时间:2015-07-21 03:59:39

标签: javascript typescript webpack

我现在正在使用webpack构建一个Typescript webapp。 一些模块可以通过写入webpack.config.js文件导入,如下所示。 但是我尝试了多少次,bootstrap模块不会被导入我的应用程序。

我该怎么办?

这是我的webpack.config.js

的一部分
plugins: [
    new webpack.ResolverPlugin(
        new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin('.bower.json', ['main'])
    ),
    new webpack.ProvidePlugin({
        jQuery: 'jquery',
        $: 'jquery',
        jquery: 'jquery',
        _: 'lodash',
        Vue: 'vue'
    }),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.AggressiveMergingPlugin()
],
module: {
    loaders: [
        { test: /\.ts$/, loader: 'ts-loader' }
    ]
}

1 个答案:

答案 0 :(得分:0)

我终于有幸找到了答案。

答案是使用BowerWebpackplugin代替webpack.ResolverPlugin.DirectoryDescriptionFilePlugin

plugins: [
    new BowerWebpackPlugin({
        modulesDirectories: ['bower_components'],
        manifestFiles: ['bower.json', 'package.json'],
        includes: [/.*\.js/],
        excludes: [/.*\.less/],
        searchResolveModulesDirectories: true
    }),
    new webpack.ProvidePlugin({
        jQuery: 'jquery',
        $: 'jquery',
        jquery: 'jquery',
        _: 'lodash',
        Vue: 'vue'
    }),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.AggressiveMergingPlugin()
],
module: {
    loaders: [
        { test: /\.ts$/, loader: 'ts-loader' }
    ]
}