Web paketi-dev sunucusu API'si ve Gulp

Question

ile satır içi modunu nasıl kullanırsınız? --inline ve --host bayraklarıyla webpack-dev-server kullanıyorum. Her şey yolunda.

webpack-dev-server --inline --host example.com

Sonra gulp kullanarak bu görevi ve webpack-dev-sunucu API tamamlamasından baktı. Bu işe görünmüyor

var gulp    = require('gulp'); 
var gutil   = require('gulp-util'); 
var Webpack   = require('webpack'); 
var WebpackDevServer = require('webpack-dev-server'); 
var WebpackConfig = require('./webpack.config.js'); 

gulp.task('default', ['webpack-dev-server']); 

gulp.task('webpack-dev-server', function(callback) { 
    new WebpackDevServer(Webpack(WebpackConfig), { 
    host: 'example.com', 
    inline: true, 
    publicPath: WebpackConfig.output.publicPath, 
    }).listen(port, host, function(err) { 
    if(err) throw new gutil.PluginError('webpack-dev-server', err); 
    gutil.log('[webpack-dev-server]', 'http://example.com:8080'); 
    }); 
}); 

, ben API için hiçbir inline veya host olduğuna inanıyoruz.

Bu mümkün mü?

Answer 1

Inline modu, varsayılan olarak etkindir - Sunucuya geçirilen seçeneklerinde bir bayrak yoluyla etkin olamaz http://host:port/webpack-dev-server/

Answer 2

satır içi seçeneği gidin. Ancak, command line script'a bir göz atarak webpack derleyicisine iletilen seçeneklere ek giriş komut dosyaları eklediğini görebilirsiniz.

Aynı şeyi kodunuzda tekrarlayabilirsiniz.

WebpackConfig.entry = [ 
    WebPackConfig.entry, // assuming you have a single existing entry 
    require.resolve("webpack-dev-server/client/") + '?http://localhost:9090', 
    'webpack/hot/dev-server' 
] 

Answer 3

webpack-dev-sunucu oluşturmak için API yaklaşımı kullanılarak , bunun yerine el ile

webpack-dev-server/client?http://<path>:<port>/ 

tanımlamak gerektiğinde mevcut değil satır içi seçeneği (tümü) giriş noktaları). Webpack-dev-server modülü olmasının nedeni, webpack yapılandırmasına erişemez. Geçerli WebPack sürümü (1.13.2) bu yapılabilir CAN yılında https://webpack.github.io/docs/webpack-dev-server.html#inline-mode-with-node-js-api

Answer 4

. documentation itibaren

:

satır içi modunu kullanmak için, ya

komut satırında --inline belirtin. içinde
belirtmek devServer: { inline: true } senin webpack.config.js

Answer 5

Öyle görünüyor ki cevaplar modası geçmiş var ve ben yudum aracılığıyla inline eklemek için bunlardan herhangi birini kullanmak başaramadı, bu yüzden webpack-dev-server.js açtı ve öyle yapar yöntemi kopyaladığınız benim gulp dosyam ve biraz değiştirdim. Bu işler (öyle olsa biraz kötü):

function addInline(config, hot) { 
    var devClient = [require.resolve("webpack-dev-server/client/") + "?http://localhost:8080"]; 

    if (hot) { 
     devClient.push("webpack/hot/dev-server"); 
    } 
    [].concat(config).forEach(function (config) { 
     if (typeof config.entry === "object" && !Array.isArray(config.entry)) { 
      Object.keys(config.entry).forEach(function (key) { 
       config.entry[key] = devClient.concat(config.entry[key]); 
      }); 
     } else { 
      config.entry = devClient.concat(config.entry); 
     } 
    }); 
} 

sen WebPack için geçirmeden önce Oraya yapılandırma geçmesi gerekecektir:

var webpackDevelopmentConfig = require('./Source/config/webpack.config.development.js'); 
addInline(webpackDevelopmentConfig) 

var compiler = webpack(webpackDevelopmentConfig);