简体   繁体   English

如何通过webpack导入引导程序?

[英]How do I import bootstrap via webpack?

I am now constructing a Typescript webapp by using webpack. 我现在正在使用webpack构建一个Typescript Webapp。 Some modules can be imported by being written in webpack.config.js file like below. 可以通过将其写入webpack.config.js文件中来导入某些模块,如下所示。 But how many times I tried, bootstrap module won't be imported into my app. 但是我尝试了多少次,引导程序模块不会导入到我的应用程序中。

How should I do ? 我应该怎么做 ?

here is a part of my webpack.config.js 这是我的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' }
    ]
}

I finally and fortunately have found an answer. 我终于幸运地找到了答案。

The answer is to use BowerWebpackplugin instead of webpack.ResolverPlugin.DirectoryDescriptionFilePlugin 答案是使用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' }
    ]
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM