gulp如何把獨(dú)立less文件編譯成css后嵌入到html頁面，變成嵌入式樣式表俭缓？
方案1：通過 gulp-replace 替換 link
（1）首先 html 頁面中應(yīng)該有對應(yīng) css 文件的 link 標(biāo)簽
（2）通過 gulp 把 link 標(biāo)簽替換成 style 標(biāo)簽的飞傀，并添加對應(yīng)的 css 內(nèi)容
方案2：直接使用 gulp-inline-source
gulpfile.js
let gulp = require('gulp');
let inlinesource = require('gulp-inline-source');
gulp.task('default', function () {
return gulp.src("src/*.html") //html文件位置
.pipe(inlinesource())
.pipe(gulp.dest("dist"));//輸出位置
});
test.js
function hello(){console.log("hello")}
test.css
h1{
font-size: 24px;
color: red;
}
html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ceshi</title>
<link rel="stylesheet" href="css/test.css" inline/> /*文件位置顿颅，一定要加inline*/
</head>
<body>
<div>
測試
</div>
<script src="js/test.js" inline></script> /*文件位置，一定要加inline*/
</body>
</html>
輸出效果
<html>
<head>
<style>h1{font-size:24px;color:red}</style>
</head>
<body>
<div>測試</div>
<script>function hello(){console.log("hello")}</script>
</body>
</html>
