我已经设置了 webpack 但是输出的 html 和 localhost 8080 html 不一样答案

【问题标题】：I have set up webpack but the output html and localhost 8080 html are not the same我已经设置了 webpack 但是输出的 html 和 localhost 8080 html 不一样
【发布时间】：2017-04-19 14:51:03
【问题描述】：

我有 localhost 8080 作为开发服务器运行，它看起来还不错。我已经检查了css样式的元素，是的，JavaScript也自动在那里，但是我在文件树中编辑的那个真正的doc html我编辑的那个没有样式和JavaScript自动编写这是怎么回事？我的网页包 .config.js 如下

var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin=require('extract-text-webpack-plugin');
//var CommonsChunkPlugin=require('webpack/lib/optimize/CommonsChunkPlugin');
module.exports = {
    devtool: 'eval',
    context: path.join(__dirname, 'src'),
    entry: {
        app: './app/app.js',
        about: './about/about.js',
        //vendors:['jquery']
    },
    output: {
        path: path.join(__dirname, 'dist'),
        filename: '[name].bundle.js'
    },
    module: {
        preLoaders: [
            {
                test: /\.js?$/,
                include: path.join(__dirname, 'src'),
                loader: 'jshint-loader'
            }
        ],
        loaders: [
            {
                test: /\.(js|jsx)$/,
                loader: 'babel-loader',
                include: path.join(__dirname, 'src'),
                exclude: /node_module/,
                query: {
                    presets: ['es2015', 'react', 'stage-1']
                }
            },
            {
                test: /\.css$/,
                loader: 'css-loader',
                include: path.join(__dirname, 'src', 'css'),
            },
            {
                test: /\.scss$/,
                loader:'style-loader!css-loader!sass-loader',
                include: path.join(__dirname, 'src')
            },
            {
                test: /\.(png|jpg)$/,
                loader: 'url-loader?limit=8192',
                include: path.join(__dirname, 'src', 'images')
            },{
                test:/\.jpg$/,
                loader:'file-loader'
            },

            {
                test: /\.(woff2?|svg)$/,
                loader: 'url-loader?limit=10000',
                include:path.join(__dirname, 'src')
            },
            {
                test: /\.(ttf|eot)$/,
                loader: 'file-loader',
                include:path.join(__dirname, 'src')
            }
        ]
    },
    jshint: {
        'esnext': true
    },
    devServer: {
        contentBase: path.join(__dirname, 'dist'),
        inline: true,
        stats: {
            colors: true,
            reasons: true,
            chunks: false
        }

    },
    plugins: [

        new HtmlWebpackPlugin({
            template: path.join(__dirname, 'src', 'index.html'),
            hash: true,
            chunks: ['app']
        }),
        new HtmlWebpackPlugin({
            template: path.join(__dirname, 'src', 'index.html'),
            hash: true,
            filename: 'about.html',
            chunks: ['about']
        })

        //new CommonsChunkPlugin({
        //  name:['commons','vendors','bootstrap']
        //})
    ],
    watch: true
};

【问题讨论】：

标签： javascript html css webpack

【解决方案1】：

关于 Javascript 不同，我看到你使用 ecmascript 2015 和 transpiler Babel； Babel 将您的代码从 ecmascript 2015 转换为 ES5，因此您看到的脚本不同
关于css，我可以看看你是怎么用的吗？

顺便说一句，您使用什么框架？反应js？

【讨论】：