JavaScript và CSS nội tuyến với webpack

Question

Tôi đang sử dụng Webpack để đóng gói tài nguyên. Hiện tại, nó đóng gói cả tệp CSS và JS vào một tệp riêng biệt được gọi là bundle.js. Làm thế nào tôi có thể làm cho cả hai JS và CSS nhúng nội tuyến trong tập tin html?

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' 
}; 

Answer 1

sử dụng https://github.com/DustinJackson/html-webpack-inline-source-plugin

plugins: [ 
    new HtmlWebpackPlugin({ 
    inlineSource: '.(js|css)$' // embed all javascript and css inline 
    }), 
    new HtmlWebpackInlineSourcePlugin() 
]