我想一直加载一个css文件
在我的angular2捆绑中(我使用的是我自己的锅炉板,非ng-cli)
像ng-cli一样使用style.css。
我不想加载它,例如使用导入
在main.ts或app.component.ts中,但是通过webpack。
有什么办法?
任何提示?
提前致谢
{
test: require.resolve(helpers.root('src','styles.css')),
loader: 'imports-loader'
}
entry: {
'styles': './src/styles.scss',
'polyfills': './src/polyfills.ts',
'main': './src/main.ts'
},
new CommonsChunkPlugin({
name: 'styles',
chunks: ['styles']
})
主要-style.loader.js
const path = require('path');
const fs = require('fs');
module.exports = function(source) {
this.cacheable();
const callback = this.async();
const stylesPath = path.resolve(__dirname,'../src','styles.scss');
this.addDependency(stylesPath);
fs.readFile(stylesPath, "utf-8", function(err, header) {
if(err) return callback(err);
console.log(header,source);
callback(null, header + "\n" + source);
});
};
的WebPack
{
use: [
'raw-loader',
'sass-loader',
'postcss-loader',
helpers.root('config','main-style.loader.js')
]
}
但我有
Error: Child compilation failed:
Module build failed: Unknown word (7:1)
5 | }
6 |
> 7 |
| ^
8 |
9 |
:
Syntax Error: Unknown word (7:1)
5 | }
6 |
> 7 |
| ^
提示来自 https://github.com/peerigon/extract-loader (你应该有一个postcss.config.js)
它的工作唯一的缺点是.my类变得像
.QZ4j2umHjjSjpjIMYOm2C
const mainCss = [
'postcss-loader',
'css-loader',
helpers.root('src','styles.css')
];
mainCss.unshift('style-loader');
entry: {
'polyfills': './src/polyfills.ts',
'main': './src/main.ts',
'mainstyles': mainCss.join('!')
},
css loader modules标志 应该设置为false和 它有效:D