2017-02-24 6 views
0

Ich habe vor kurzem begonnen, Webpack 2 mit dem Dev-Server zu verwenden, der gut funktioniert. Sobald ich die Optionen für den Webpack-dev-Server hinzufüge, macht es das, was es tun soll, zeigt nur minimale Rückmeldungen in der Befehlszeile, stoppt aber die Live-Aktualisierung. Hier sind die Optionen Ich füge webpack das Feedback zu manipulieren:Webpack 2 devServer-Optionen verhindern Live-Nachladen?

devServer: { 
    stats: 'minimal' 
}, 

Für Kontext, hier ist mein webpack config:

import webpack from 'webpack' 
import path from 'path' 
import ExtractTextPlugin from 'extract-text-webpack-plugin' 

const nodeModules  = path.resolve(__dirname, 'node_modules') 

const config = { 

    entry: './src/js/index.js', 
    output: { 
     path: path.join(__dirname, "site/assets"), 
     filename: 'index.js', 
     publicPath: '/site/assets' 
    }, 

    devServer: { 
     stats: 'minimal' 
    }, 

    module: { 
     rules: [ 
      { 
       test  : /\.js$/, 
       loader : 'babel-loader', 
       exclude : [nodeModules] 
      }, 
      { 
       test: /\.css$/, 
       loader: "style-loader!css-loader" 
      }, 

      { 
       test  : /\.scss$/, 
       use  : ExtractTextPlugin.extract({ 
        fallback: 'style-loader', 
        use: ['css-loader', 'sass-loader'] 
       }), 
       exclude : [nodeModules] 
      }, 
      { 
       test  : /\.(png|jpg)$/, 
       loader : 'url-loader' 
      } 
     ] 
    }, 

    plugins: [ 
     new ExtractTextPlugin('main.css') 
    ] 
}; 

export default config 

Und hier ist mein package.json mit den Skripten in:

{ 
    "name": "webpack-demo", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "watch": "webpack --progress --colors --watch", 
    "build": "webpack --progress --colors", 
    "deploy": "NODE_ENV=production webpack -p --progress --colors", 
    "start": "webpack-dev-server" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "webpack": "^2.2.1" 
    }, 
    "dependencies": { 
    "babel-core": "^6.23.1", 
    "babel-loader": "^6.3.2", 
    "babel-polyfill": "^6.23.0", 
    "babel-preset-es2015": "^6.22.0", 
    "babel-preset-stage-0": "^6.22.0", 
    "base-64": "^0.1.0", 
    "bourbon": "^4.3.2", 
    "css-loader": "^0.26.1", 
    "extract-text-webpack-plugin": "^2.0.0-beta", 
    "file-loader": "^0.10.0", 
    "fractions-2": "^2.1.7", 
    "json-loader": "^0.5.4", 
    "lodash": "^4.17.4", 
    "node-sass": "^4.5.0", 
    "sass-loader": "^6.0.2", 
    "style-loader": "^0.13.1", 
    "url-loader": "^0.5.7", 
    "webpack-dev-server": "^2.4.1" 
    } 
} 

Ich kann nicht herausfinden, warum diese Option das Live-Nachladen knockout würde? Jeder Einblick geschätzt!

Antwort

1

fand ich die einfachste Art und Weise zu erreichen, was ich wollte, war mein Startskript in meinem package.json an diese anzupassen:

"start": "webpack-dev-server --hot --inline" 

Da ist in meinem webpack Config hielt ich die minimale Option Statistiken in und jetzt funktioniert wie vorgesehen.