Question

在项目中使用angular 2 + webpack + bootstrap

我想使用自定义主题进行引导 - 将 node_modules /../bootstrap.css 替换为 ./ Content / bootstrap.min.css

我为

添加了别名

alias: {
            'bootstrap/dist/css/bootstrap.css': './Content/bootstrap.min.css',
        }

但有错误

Can't resolve '../fonts/glyphicons-halflings-regular.eot' in '\Content'
 @ ./Content/bootstrap.min.css

如何替换文件但不更改依赖资源的文件夹

例如

必须在 \ node_modules 中搜索

glyphicons-halflings-regular.eot ，而不是 Content

Answer 1

也许是另一个别名：

'./Content/fonts': 'node_modules/bootstrap/dist/fonts'

看起来有点hacky，但也许试一试。

Answer 2

您可以使用CopyWebpackPlugin加载css，js文件。尝试此代码

npm install copy-webpack-plugin --save-dev

  resolve: {
        extensions: ['.ts', '.js'],
        alias: {
            Content$: path.resolve(__dirname, './Content'),         
        }
    },

plugins: [
        new CopyWebpackPlugin([
            { from: 'bootstrap/dist/css/bootstrap.css', to: './Content' }
        ])
]

webpack只替换库中的一个文件（bootstrap）

2 个答案: