css防注入,禁止Webpack注入CSS

使用webpack，我捆绑了一个项目。 一切都很好，并且可以正常工作。 但是，我想知道是否可以不将在TS文件中导入的(S)CSS直接插入JS。 确实，我想要的只是webpack创建的输出中的单独的CSS文件和js文件。

让我尝试通过一个例子来说明。 我有两个TS文件：

file1.tsrequire('./style1.scss');

// some ts functions

...

file2.tsrequire('./style2.scss');

// some ts functions

...

使用此webpack配置：{

entry: {

...

},

module: {

rules: [

// TypeScript

{

test: /\.ts$/,

loader: 'babel-loader',

exclude: /node_modules/,

},

// Style

{

test: /\.s?[ac]ss$/,

exclude: /node_modules/,

use: [

MiniCssExtractPlugin.loader,

{

loader: 'css-loader',

},

{

loader: 'sass-loader',

}

],

}

]

},

resolve: { extensions: ['.js', '.ts'] },

plugins: [

new MiniCssExtractPlugin({

filename: '[name].css',

chunkFilename: '[id].css'

})

],

};

我想要两个输出：-bundle.js-bundle.css

这样，在我的html中，我将能够引用或不引用css。