使用 webpack 内联 JavaScript 和 CSS [英] Inline JavaScript and CSS with webpack
本文介绍了使用 webpack 内联 JavaScript 和 CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用 Webpack 来捆绑资源.目前,它将 CSS 和 JS 文件捆绑到一个名为 bundle.js 的单独文件中.如何将 JS 和 CSS 嵌入到 html 文件中?
I'm using Webpack for bundling resources. Currently it bundle both the CSS and JS files into a separate file called bundle.js. How can I make both the JS and CSS embedded inline in html file?
import HtmlWebpackPlugin from 'html-webpack-plugin';
import {HotModuleReplacementPlugin} from 'webpack';
export default {
entry: {app: './test/dev'},
module: {
loaders: [
{test: /\.js/, loader: 'babel-loader', exclude: /node_modules/},
{test: /\.scss$/, loader: 'style!css!sass'}
]
},
plugins: [new HotModuleReplacementPlugin(), new HtmlWebpackPlugin()],
devtool: 'eval-source-map'
};
推荐答案
使用 https://github.com/DustinJackson/html-webpack-inline-source-plugin
plugins: [
new HtmlWebpackPlugin({
inlineSource: '.(js|css)$' // embed all javascript and css inline
}),
new HtmlWebpackInlineSourcePlugin()
]
这篇关于使用 webpack 内联 JavaScript 和 CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文