Bonjour,
Voila je rencontre un petit problème avec mon code.
Je me demande
Si il est possible de binder un serveur webpack d'une machine virtuelle vers son système.
Celà reviendrait également à pourvoir utiliser webpack dev server sur un serveur distant.
J'ai beau modifier la conf mais est ce faisable finallement?
'use strict'
const path = require('path')
const webpack = require('webpack')
const webpack_base = require('./webpack.base')
const config = require('./config')
webpack_base.devtool = 'cheap-module-eval-source-map'
webpack_base.output.publicPath = 'http://local.dev:' + config.port + config.assets_url
webpack_base.output.path = '/tmp/'
for (var name in webpack_base.entry) {
webpack_base.entry[name] = [path.resolve(__dirname, './server-client'), ...webpack_base.entry[name]]
}
webpack_base.plugins.push(
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
)
webpack_base.module.loaders.forEach(function (loader) {
if (loader.vue) {
webpack_base.vue.loaders[loader.vue] = 'vue-style-loader!' + loader.loaders.join('-loader!') + '-loader'
}
if (loader.loaders && loader.loaders.includes('css')) {
loader.loaders = ['style', ...loader.loaders]
}
})
module.exports = webpack_base
'use strict'
const WebpackDevServer = require('webpack-dev-server')
const webpack = require('webpack')
const webpack_dev = require('./webpack.dev')
const config = require('./config')
const compiler = webpack(webpack_dev)
const hotMiddleware = require('webpack-hot-middleware')(compiler)
const chokidar = require('chokidar')
// Force le rafraichissement du navigateur
let refresh = function (path) {
console.log('* ' + path + ' changed')
hotMiddleware.publish({action: 'reload'})
}
let server = new WebpackDevServer(compiler, {
hot: true,
historyApiFallback: false,
quiet: false,
noInfo: false,
publicPath: webpack_dev.output.publicPath,
stats: {
colors: true,
chunks: false
}
})
server.use(hotMiddleware)
server.listen( {host: '0.0.0.0',port: 3003,function (err) {
if (err) {
console.log(err)
return
}
chokidar.watch(config.refresh).on('change', refresh)
console.log('==> Listening on http://0.0.0.0:3003')
}})
/* eslint-disable */
var config = require('./config')
// From https://raw.githubusercontent.com/glenjamin/webpack-hot-middleware/master/client.js
var options = {
// path: "http://localhost:" + config.port + "/__webpack_hmr",
path: "http://local.dev:" + config.port + "/__webpack_hmr",
timeout: 20 * 1000,
overlay: true,
reload: true,
log: false,
warn: false,
};
if (typeof window === 'undefined') {
// do nothing
} else if (typeof window.EventSource === 'undefined') {
console.warn(
"webpack-hot-middleware's client requires EventSource to work. " +
"You should include a polyfill if you want to support this browser: " +
"https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events#Tools"
);
} else {
connect(window.EventSource);
}
function connect(EventSource) {
var source = new EventSource(options.path);
var lastActivity = new Date();
source.onopen = handleOnline;
source.onmessage = handleMessage;
source.onerror = handleDisconnect;
var timer = setInterval(function() {
if ((new Date() - lastActivity) > options.timeout) {
handleDisconnect();
}
}, options.timeout / 2);
function handleOnline() {
if (options.log) console.log("[HMR] connected");
lastActivity = new Date();
}
function handleMessage(event) {
lastActivity = new Date();
if (event.data == "\uD83D\uDC93") {
return;
}
try {
processMessage(JSON.parse(event.data));
} catch (ex) {
if (options.warn) {
console.warn("Invalid HMR message: " + event.data + "\n" + ex);
}
}
}
function handleDisconnect() {
clearInterval(timer);
source.close();
setTimeout(function() { connect(EventSource); }, options.timeout);
}
}
var reporter;
// the reporter needs to be a singleton on the page
// in case the client is being used by mutliple bundles
// we only want to report once.
// all the errors will go to all clients
var singletonKey = '__webpack_hot_middleware_reporter__';
if (typeof window !== 'undefined' && !window[singletonKey]) {
reporter = window[singletonKey] = createReporter();
}
function createReporter() {
var strip = require('strip-ansi');
var overlay;
if (typeof document !== 'undefined' && options.overlay) {
overlay = require('webpack-hot-middleware/client-overlay');
}
return {
problems: function(type, obj) {
if (options.warn) {
console.warn("[HMR] bundle has " + type + ":");
obj[type].forEach(function(msg) {
console.warn("[HMR] " + strip(msg));
});
}
if (overlay && type !== 'warnings') overlay.showProblems(type, obj[type]);
},
success: function() {
if (overlay) overlay.clear();
},
useCustomOverlay: function(customOverlay) {
overlay = customOverlay;
}
};
}
var processUpdate = require('webpack-hot-middleware/process-update');
var customHandler;
var subscribeAllHandler;
function processMessage(obj) {
if (obj.action == "building") {
if (options.log) console.log("[HMR] bundle rebuilding");
} else if (obj.action == "built") {
if (options.log) {
console.log(
"[HMR] bundle " + (obj.name ? obj.name + " " : "") +
"rebuilt in " + obj.time + "ms"
);
}
if (obj.errors.length > 0) {
if (reporter) reporter.problems('errors', obj);
} else {
if (reporter) {
if (obj.warnings.length > 0) reporter.problems('warnings', obj);
reporter.success();
}
processUpdate(obj.hash, obj.modules, options);
}
} else if (customHandler) {
customHandler(obj);
}
if (subscribeAllHandler) {
subscribeAllHandler(obj);
}
}
customHandler = function (event) {
if (event.action === 'reload') {
window.location.reload()
}
}
Ce que je veux
que le hmr_fonctionne à distance
Ce que j'obtiens
rien et aucune erreur en console