Comments (21)
var base_configuration = require('./webpack.dev.babel');
var configuration = require('./webpack.base.babel')(base_configuration);
I think naming is wrong in that piece of code.
When exactly do you get the error?
Is it when you run node
?
Or is it when you run webpack
?
from universal-webpack.
As I said, when I run node there are no errors, server simply is not starting.
from universal-webpack.
As I said, when I run node there are no errors, server simply is not starting.
.
When exactly do you get the error? Is it when you run node? Or is it when you run webpack?
from universal-webpack.
Hm, I can not understand you. When I run start command (described in initial post) I have the following output in node console
cross-env NODE_ENV=development webpack --config internals/webpack/webpack.dev.server.babel.js && node server/start-server
./internals/webpack 160 bytes {0} [built]
./server/middlewares 160 bytes {0} [built]
+ 35 hidden modules
And that is all, nothing more. But if you will look at command, server is supposed to start . But build is done, and when I run bundling result manually I receive described in start post error. This mistake appears when I am running node.If you have some time I can publish code on github. In fact? I advice you to look at the provided boilerplate ( https://github.com/mxstbr/react-boilerplate ). I am trying to implement ssr in it. If you will be able to do it - it will be cool
from universal-webpack.
This mistake appears when I am running node
What is the exact node
command you're running and what is the exact full console output
from universal-webpack.
Exact Node command which I am running is:
"start": "cross-env NODE_ENV=development webpack --config internals/webpack/webpack.dev.server.babel.js && node server/start-server",
In this case full console output is:
cross-env NODE_ENV=development webpack --config internals/webpack/webpack.dev.server.babel.js && node server/start-server
./internals/webpack 160 bytes {0} [built]
./server/middlewares 160 bytes {0} [built]
+ 35 hidden modules
And command is finished (server is not running for some reason, but it should run according your tutorial). But I can see bundle build in this case in build/server.js
. When I am truing to run bundled server manually using:
node build/server
I am getting following error
module.js:442
throw err;
^
Error: Cannot find module 'components/Img'
at Function.Module._resolveFilename (module.js:440:15)
at Function.Module._load (module.js:388:25)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (E:\sandbox\node\reactv11\build\server.js:945:19)
at __webpack_require__ (E:\sandbox\node\reactv11\build\server.js:21:30)
at Object.module.exports.module.exports.server.input (E:\sandbox\node\reactv11\build\server.js:330:74)
at __webpack_require__ (E:\sandbox\node\reactv11\build\server.js:21:30)
at Object.<anonymous> (E:\sandbox\node\reactv11\build\server.js:220:79)
at __webpack_require__ (E:\sandbox\node\reactv11\build\server.js:21:30)
If you want, you may close the issue. I understand that it is possibly my mistake. I simply can not figure out what I am doing wrong by myself
from universal-webpack.
Exact Node command which I am running is:
Wrong.
This consists of 2 commands.
from universal-webpack.
node build/server
This one is closer
from universal-webpack.
Error: Cannot find module 'components/Img'
Post your build/server
file
from universal-webpack.
It is bundled server build. Should I post it?
from universal-webpack.
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId])
/******/ return installedModules[moduleId].exports;
/******/
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 17);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/*!***********************!*\
!*** external "path" ***!
\***********************/
/***/ function(module, exports) {
module.exports = require("path");
/***/ },
/* 1 */
/*!***************************!*\
!*** ./internals/webpack ***!
\***************************/
/***/ function(module, exports) {
function webpackEmptyContext(req) {
throw new Error("Cannot find module '" + req + "'.");
}
webpackEmptyContext.keys = function() { return []; };
webpackEmptyContext.resolve = webpackEmptyContext;
module.exports = webpackEmptyContext;
webpackEmptyContext.id = 1;
/***/ },
/* 2 */
/*!**************************!*\
!*** external "webpack" ***!
\**************************/
/***/ function(module, exports) {
module.exports = require("webpack");
/***/ },
/* 3 */
/*!**************************!*\
!*** ./server/logger.js ***!
\**************************/
/***/ function(module, exports, __webpack_require__) {
/* eslint-disable no-console */
var chalk = __webpack_require__(/*! chalk */ 24);
var ip = __webpack_require__(/*! ip */ 29);
var divider = chalk.gray('\n-----------------------------------');
/**
* Logger middleware, you can customize it to make messages more personal
*/
var logger = {
// Called whenever there's an error on the server we want to print
error: function error(err) {
console.error(chalk.red(err));
},
// Called when express.js app starts on given port w/o errors
appStarted: function appStarted(port, tunnelStarted) {
console.log('Server started ' + chalk.green('✓'));
// If the tunnel started, log that and the URL it's available at
if (tunnelStarted) {
console.log('Tunnel initialised ' + chalk.green('✓'));
}
console.log('\n' + chalk.bold('Access URLs:') + divider + '\nLocalhost: ' + chalk.magenta('http://localhost:' + port) + '\n LAN: ' + (chalk.magenta('http://' + ip.address() + ':' + port) + (tunnelStarted ? '\n Proxy: ' + chalk.magenta(tunnelStarted) : '')) + divider + '\n' + chalk.blue('Press ' + chalk.italic('CTRL-C') + ' to stop') + '\n ');
}
};
module.exports = logger;
/***/ },
/* 4 */
/*!**************************!*\
!*** external "express" ***!
\**************************/
/***/ function(module, exports) {
module.exports = require("express");
/***/ },
/* 5 */
/*!**************************************!*\
!*** ./~/css-loader/lib/css-base.js ***!
\**************************************/
/***/ function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function() {
var list = [];
// return the list of modules as css string
list.toString = function toString() {
var result = [];
for(var i = 0; i < this.length; i++) {
var item = this[i];
if(item[2]) {
result.push("@media " + item[2] + "{" + item[1] + "}");
} else {
result.push(item[1]);
}
}
return result.join("");
};
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
/***/ },
/* 6 */
/*!**************************!*\
!*** external "cheerio" ***!
\**************************/
/***/ function(module, exports) {
module.exports = require("cheerio");
/***/ },
/* 7 */
/*!*********************!*\
!*** external "fs" ***!
\*********************/
/***/ function(module, exports) {
module.exports = require("fs");
/***/ },
/* 8 */
/*!**************************************!*\
!*** external "html-webpack-plugin" ***!
\**************************************/
/***/ function(module, exports) {
module.exports = require("html-webpack-plugin");
/***/ },
/* 9 */
/*!**************************************************!*\
!*** ./server/middlewares/frontendMiddleware.js ***!
\**************************************************/
/***/ function(module, exports, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__app_containers_App__ = __webpack_require__(/*! ../../app/containers/App */ 12);
/* eslint-disable global-require */
var express = __webpack_require__(/*! express */ 4);
var path = __webpack_require__(/*! path */ 0);
var compression = __webpack_require__(/*! compression */ 28);
var pkg = !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }());
// Dev middleware
var addDevMiddlewares = function addDevMiddlewares(app, webpackConfig) {
var webpack = __webpack_require__(/*! webpack */ 2);
var webpackDevMiddleware = __webpack_require__(/*! webpack-dev-middleware */ 35);
var webpackHotMiddleware = __webpack_require__(/*! webpack-hot-middleware */ 36);
var compiler = webpack(webpackConfig);
var middleware = webpackDevMiddleware(compiler, {
noInfo: true,
publicPath: webpackConfig.output.publicPath,
silent: true,
stats: 'errors-only'
});
app.use(middleware);
app.use(webpackHotMiddleware(compiler));
// Since webpackDevMiddleware uses memory-fs internally to store build
// artifacts, we use it instead
var fs = middleware.fileSystem;
if (pkg.dllPlugin) {
app.get(/\.dll\.js$/, function (req, res) {
var filename = req.path.replace(/^\//, '');
res.sendFile(path.join(process.cwd(), pkg.dllPlugin.path, filename));
});
}
app.get('*', function (req, res) {
fs.readFile(path.join(compiler.outputPath, 'index.html'), function (err, file) {
if (err) {
res.sendStatus(404);
} else {
res.send(file.toString());
}
});
});
};
// Production middlewares
var addProdMiddlewares = function addProdMiddlewares(app, options) {
var publicPath = options.publicPath || '/';
var outputPath = options.outputPath || path.resolve(process.cwd(), 'build');
// compression middleware compresses your server responses which makes them
// smaller (applies also to assets). You can read more about that technique
// and other good practices on official Express.js docs http://mxs.is/googmy
app.use(compression());
app.use(publicPath, express.static(outputPath));
app.get('*', function (req, res) {
return res.sendFile(path.resolve(outputPath, 'index.html'));
});
};
/**
* Front-end middleware
*/
module.exports = function (app, options) {
var isProd = "development" === 'production';
console.log('sjdhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh');
if (isProd) {
addProdMiddlewares(app, options);
} else {
//const webpackConfig = require('../../internals/webpack/webpack.dev.babel');
var webpackConfig = __webpack_require__(/*! ../../internals/webpack/webpack.dev.client.babel */ 16);
addDevMiddlewares(app, webpackConfig);
}
return app;
};
/***/ },
/* 10 */
/*!***************************!*\
!*** external "minimist" ***!
\***************************/
/***/ function(module, exports) {
module.exports = require("minimist");
/***/ },
/* 11 */
/*!************************!*\
!*** external "ngrok" ***!
\************************/
/***/ function(module, exports) {
module.exports = require("ngrok");
/***/ },
/* 12 */
/*!*************************************!*\
!*** ./app/containers/App/index.js ***!
\*************************************/
/***/ function(module, exports, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(/*! react */ 33);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __WEBPACK_IMPORTED_MODULE_0_react__ && __WEBPACK_IMPORTED_MODULE_0_react__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_0_react__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_0_react__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_0_react___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_0_react___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css__ = __webpack_require__(/*! sanitize.css/sanitize.css */ 20);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css___default = __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css__ && __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_1_sanitize_css_sanitize_css___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_components_Img__ = __webpack_require__(/*! components/Img */ 27);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_components_Img___default = __WEBPACK_IMPORTED_MODULE_2_components_Img__ && __WEBPACK_IMPORTED_MODULE_2_components_Img__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_2_components_Img__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_2_components_Img__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_2_components_Img___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_2_components_Img___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3_components_Footer__ = __webpack_require__(/*! components/Footer */ 26);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3_components_Footer___default = __WEBPACK_IMPORTED_MODULE_3_components_Footer__ && __WEBPACK_IMPORTED_MODULE_3_components_Footer__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_3_components_Footer__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_3_components_Footer__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_3_components_Footer___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_3_components_Footer___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg__ = __webpack_require__(/*! ./banner-metal.jpg */ 22);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg___default = __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg__ && __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5_components_A__ = __webpack_require__(/*! components/A */ 25);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5_components_A___default = __WEBPACK_IMPORTED_MODULE_5_components_A__ && __WEBPACK_IMPORTED_MODULE_5_components_A__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_5_components_A__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_5_components_A__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_5_components_A___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_5_components_A___default });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__styles_css__ = __webpack_require__(/*! ./styles.css */ 21);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__styles_css___default = __WEBPACK_IMPORTED_MODULE_6__styles_css__ && __WEBPACK_IMPORTED_MODULE_6__styles_css__.__esModule ? function() { return __WEBPACK_IMPORTED_MODULE_6__styles_css__['default'] } : function() { return __WEBPACK_IMPORTED_MODULE_6__styles_css__; }
/* harmony import */ Object.defineProperty(__WEBPACK_IMPORTED_MODULE_6__styles_css___default, 'a', { get: __WEBPACK_IMPORTED_MODULE_6__styles_css___default });
/**
*
* App.react.js
*
* This component is the skeleton around the actual pages, and should only
* contain code that should be seen on all pages. (e.g. navigation bar)
*/
// Import the CSS reset, which HtmlWebpackPlugin transfers to the build folder
function App(props) {
return /* harmony import */__WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement(
'div',
{ className: /* harmony import */__WEBPACK_IMPORTED_MODULE_6__styles_css___default.a.wrapper },
/* harmony import */__WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement(
/* harmony import */__WEBPACK_IMPORTED_MODULE_5_components_A___default.a,
{ className: /* harmony import */__WEBPACK_IMPORTED_MODULE_6__styles_css___default.a.logoWrapper, href: 'https://twitter.com/mxstbr' },
/* harmony import */__WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement(/* harmony import */__WEBPACK_IMPORTED_MODULE_2_components_Img___default.a, { className: /* harmony import */__WEBPACK_IMPORTED_MODULE_6__styles_css___default.a.logo, src: /* harmony import */__WEBPACK_IMPORTED_MODULE_4__banner_metal_jpg___default.a, alt: 'react-boilerplate - Logo' })
),
props.children,
/* harmony import */__WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement(/* harmony import */__WEBPACK_IMPORTED_MODULE_3_components_Footer___default.a, null)
);
}
App.propTypes = {
children: /* harmony import */__WEBPACK_IMPORTED_MODULE_0_react___default.a.PropTypes.node
};
/* unused harmony default export */ var _unused_webpack_default_export = App;
/***/ },
/* 13 */
/*!*********************************************************!*\
!*** ./internals/webpack/universal-webpack-settings.js ***!
\*********************************************************/
/***/ function(module, exports) {
/**
* Created by Denis on 6/16/2016.
*/
//require('../../server/index')
module.exports = {
server: {
input: './server/index',
output: './build/server.js'
}
};
/***/ },
/* 14 */
/*!*************************************************!*\
!*** ./internals/webpack/webpack.base.babel.js ***!
\*************************************************/
/***/ function(module, exports, __webpack_require__) {
/**
* COMMON WEBPACK CONFIGURATION
*/
var path = __webpack_require__(/*! path */ 0);
var webpack = __webpack_require__(/*! webpack */ 2);
module.exports = function (options) {
return {
context: process.cwd(),
entry: options.entry,
output: Object.assign({ // Compile into js/build.js
path: path.resolve(process.cwd(), 'build'),
publicPath: '/'
}, options.output), // Merge with env dependent settings
module: {
loaders: [{
test: /\.js$/, // Transform all .js files required somewhere with Babel
loader: 'babel',
exclude: /node_modules/,
query: options.babelQuery
}, {
// Transform our own .css files with PostCSS and CSS-modules
test: /\.css$/,
exclude: /node_modules/,
loader: options.cssLoaders
}, {
// Do not transform vendor's CSS with CSS-modules
// The point is that they remain in global scope.
// Since we require these CSS files in our JS or CSS files,
// they will be a part of our compilation either way.
// So, no need for ExtractTextPlugin here.
test: /\.css$/,
include: /node_modules/,
loaders: ['style-loader', 'css-loader']
}, {
test: /\.(eot|svg|ttf|woff|woff2)$/,
loader: 'file-loader'
}, {
test: /\.(jpg|png|gif)$/,
loaders: ['file-loader', 'image-webpack?{progressive:true, optimizationLevel: 7, interlaced: false, pngquant:{quality: "65-90", speed: 4}}']
}, {
test: /\.html$/,
loader: 'html-loader'
}, {
test: /\.json$/,
loader: 'json-loader'
}, {
test: /\.mp4$/,
loader: 'url?limit=10000&mimetype=video/mp4'
}, {
test: /\.webm$/,
loader: 'url?limit=10000&mimetype=video/webm'
}]
},
plugins: options.plugins.concat([new webpack.ProvidePlugin({
// make fetch available
fetch: 'exports?self.fetch!whatwg-fetch'
}),
// Always expose NODE_ENV to webpack, in order to use `process.env.NODE_ENV`
// inside your code for any environment checks; UglifyJS will automatically
// drop any unreachable code.
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify("development")
}
})]),
postcss: function postcss() {
return options.postcssPlugins;
},
resolve: {
modules: ['app', 'node_modules'],
extensions: ['', '.js', '.jsx', '.react.js'],
packageMains: ['jsnext:main', 'main']
},
devtool: options.devtool,
//target: 'web', // Make web variables accessible to webpack, e.g. window
stats: false, // Don't show stats in the console
progress: true
};
};
/***/ },
/* 15 */
/*!************************************************!*\
!*** ./internals/webpack/webpack.dev.babel.js ***!
\************************************************/
/***/ function(module, exports, __webpack_require__) {
/**
* DEVELOPMENT WEBPACK CONFIGURATION
*/
var path = __webpack_require__(/*! path */ 0);
var fs = __webpack_require__(/*! fs */ 7);
var webpack = __webpack_require__(/*! webpack */ 2);
var HtmlWebpackPlugin = __webpack_require__(/*! html-webpack-plugin */ 8);
var logger = __webpack_require__(/*! ../../server/logger */ 3);
var cheerio = __webpack_require__(/*! cheerio */ 6);
var pkg = !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }());
var dllPlugin = pkg.dllPlugin;
// PostCSS plugins
var cssnext = __webpack_require__(/*! postcss-cssnext */ 30);
var postcssFocus = __webpack_require__(/*! postcss-focus */ 31);
var postcssReporter = __webpack_require__(/*! postcss-reporter */ 32);
var plugins = [
// new webpack.HotModuleReplacementPlugin(), // Tell webpack we want hot reloading
// new webpack.NoErrorsPlugin(),
// new HtmlWebpackPlugin({
// inject: true, // Inject all files that are generated by webpack, e.g. bundle.js
// templateContent: templateContent(), // eslint-disable-line no-use-before-define
// }),
];
// module.exports = require('./webpack.base.babel')({
// // Add hot reloading in development
// entry: [
// //'eventsource-polyfill', // Necessary for hot reloading with IE
// //'webpack-hot-middleware/client',
// path.join(process.cwd(), 'app/app.js'), // Start with js/app.js
// ],
//
// // Don't use hashes in dev mode for better performance
// output: {
// filename: '[name].js',
// chunkFilename: '[name].chunk.js',
// },
//
// // Add development plugins
// plugins: dependencyHandlers().concat(plugins), // eslint-disable-line no-use-before-define
//
// // Load the CSS in a style tag in development
// cssLoaders: 'style-loader!css-loader?localIdentName=[local]__[path][name]__[hash:base64:5]&modules&importLoaders=1&sourceMap!postcss-loader',
//
// // Process the CSS with PostCSS
// postcssPlugins: [
// postcssFocus(), // Add a :focus to every :hover
// cssnext({ // Allow future CSS features to be used, also auto-prefixes the CSS...
// browsers: ['last 2 versions', 'IE > 10'], // ...based on this browser list
// }),
// postcssReporter({ // Posts messages from plugins to the terminal
// clearMessages: true,
// }),
// ],
//
// // Tell babel that we want to hot-reload
// babelQuery: {
// //presets: ['react-hmre'],
// },
//
// // Emit a source map for easier debugging
// devtool: 'cheap-module-eval-source-map',
// });
/////////////////////////////////
module.exports = {
// Add hot reloading in development
entry: [
//'eventsource-polyfill', // Necessary for hot reloading with IE
//'webpack-hot-middleware/client',
path.join(process.cwd(), 'app/app.js')],
// Start with js/app.js
// Don't use hashes in dev mode for better performance
output: {
filename: '[name].js',
chunkFilename: '[name].chunk.js'
},
// Add development plugins
plugins: dependencyHandlers().concat(plugins), // eslint-disable-line no-use-before-define
// Load the CSS in a style tag in development
cssLoaders: 'style-loader!css-loader?localIdentName=[local]__[path][name]__[hash:base64:5]&modules&importLoaders=1&sourceMap!postcss-loader',
// Process the CSS with PostCSS
postcssPlugins: [postcssFocus(), // Add a :focus to every :hover
cssnext({ // Allow future CSS features to be used, also auto-prefixes the CSS...
browsers: ['last 2 versions', 'IE > 10'] }), // ...based on this browser list
postcssReporter({ // Posts messages from plugins to the terminal
clearMessages: true
})],
// Tell babel that we want to hot-reload
babelQuery: {
//presets: ['react-hmre'],
},
// Emit a source map for easier debugging
devtool: 'cheap-module-eval-source-map'
};
////////////////////////////////
/**
* Select which plugins to use to optimize the bundle's handling of
* third party dependencies.
*
* If there is a dllPlugin key on the project's package.json, the
* Webpack DLL Plugin will be used. Otherwise the CommonsChunkPlugin
* will be used.
*
*/
function dependencyHandlers() {
// Don't do anything during the DLL Build step
if ({"NODE_ENV":"development"}.BUILDING_DLL) {
return [];
}
// If the package.json does not have a dllPlugin property, use the CommonsChunkPlugin
if (!dllPlugin) {
return [new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
children: true,
minChunks: 2,
async: true
})];
}
var dllPath = path.resolve(process.cwd(), dllPlugin.path || 'node_modules/react-boilerplate-dlls');
/**
* If DLLs aren't explicitly defined, we assume all production dependencies listed in package.json
* Reminder: You need to exclude any server side dependencies by listing them in dllConfig.exclude
*
* @see https://github.com/mxstbr/react-boilerplate/tree/master/docs/general/webpack.md
*/
if (!dllPlugin.dlls) {
var manifestPath = path.resolve(dllPath, 'reactBoilerplateDeps.json');
if (!fs.existsSync(manifestPath)) {
logger.error('The DLL manifest is missing. Please run `npm run build:dll`');
process.exit(0);
}
return [new webpack.DllReferencePlugin({
context: process.cwd(),
manifest: !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }()) })];
}
// If DLLs are explicitly defined, we automatically create a DLLReferencePlugin for each of them.
// eslint-disable-line global-require
var dllManifests = Object.keys(dllPlugin.dlls).map(function (name) {
return path.join(dllPath, '/' + name + '.json');
});
return dllManifests.map(function (manifestPath) {
if (!fs.existsSync(path)) {
if (!fs.existsSync(manifestPath)) {
logger.error('The following Webpack DLL manifest is missing: ' + path.basename(manifestPath));
logger.error('Expected to find it in ' + dllPath);
logger.error('Please run: npm run build:dll');
process.exit(0);
}
}
return new webpack.DllReferencePlugin({
context: process.cwd(),
manifest: !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }()) });
});
}
/**
* We dynamically generate the HTML content in development so that the different
* DLL Javascript files are loaded in script tags and available to our application.
*/
// eslint-disable-line global-require
function templateContent() {
var html = fs.readFileSync(path.resolve(process.cwd(), 'app/index.html')).toString();
if (!dllPlugin) {
return html;
}
var doc = cheerio(html);
var body = doc.find('body');
var dllNames = !dllPlugin.dlls ? ['reactBoilerplateDeps'] : Object.keys(dllPlugin.dlls);
dllNames.forEach(function (dllName) {
return body.append('<script data-dll=\'true\' src=\'/' + dllName + '.dll.js\'></script>');
});
return doc.toString();
}
/***/ },
/* 16 */
/*!*******************************************************!*\
!*** ./internals/webpack/webpack.dev.client.babel.js ***!
\*******************************************************/
/***/ function(module, exports, __webpack_require__) {
/**
* Created by Denis on 6/16/2016.
*/
var client_configuration = __webpack_require__(/*! universal-webpack */ 34).clientConfiguration;
var settings = __webpack_require__(/*! ./universal-webpack-settings */ 13);
var base_configuration = __webpack_require__(/*! ./webpack.dev.babel */ 15);
var webpack = __webpack_require__(/*! webpack */ 2);
var path = __webpack_require__(/*! path */ 0);
var fs = __webpack_require__(/*! fs */ 7);
var pkg = !(function webpackMissingModule() { var e = new Error("Cannot find module \".\""); e.code = 'MODULE_NOT_FOUND'; throw e; }());
var dllPlugin = pkg.dllPlugin;
var logger = __webpack_require__(/*! ../../server/logger */ 3);
var cheerio = __webpack_require__(/*! cheerio */ 6);
var HtmlWebpackPlugin = __webpack_require__(/*! html-webpack-plugin */ 8);
var plugins = [new webpack.HotModuleReplacementPlugin(), // Tell webpack we want hot reloading
new webpack.NoErrorsPlugin(), new HtmlWebpackPlugin({
inject: true, // Inject all files that are generated by webpack, e.g. bundle.js
templateContent: templateContent() })];
/**
* We dynamically generate the HTML content in development so that the different
* DLL Javascript files are loaded in script tags and available to our application.
*/
// eslint-disable-line no-use-before-define
function templateContent() {
var html = fs.readFileSync(path.resolve(process.cwd(), 'app/index.html')).toString();
if (!dllPlugin) {
return html;
}
var doc = cheerio(html);
var body = doc.find('body');
var dllNames = !dllPlugin.dlls ? ['reactBoilerplateDeps'] : Object.keys(dllPlugin.dlls);
dllNames.forEach(function (dllName) {
return body.append('<script data-dll=\'true\' src=\'/' + dllName + '.dll.js\'></script>');
});
return doc.toString();
}
base_configuration.entry.splice(0, 0, 'eventsource-polyfill', 'webpack-hot-middleware/client');
base_configuration.plugins = base_configuration.plugins.concat(plugins);
base_configuration.babelQuery = {
presets: ['react-hmre']
};
var final_configuration = __webpack_require__(/*! ./webpack.base.babel */ 14)(base_configuration);
//module.exports = final_configuration;
module.exports = client_configuration(final_configuration, settings);
//export default client_configuration(configuration, settings)
/***/ },
/* 17 */
/*!*************************!*\
!*** ./server/index.js ***!
\*************************/
/***/ function(module, exports, __webpack_require__) {
/* eslint consistent-return:0 */
var express = __webpack_require__(/*! express */ 4);
var logger = __webpack_require__(/*! ./logger */ 3);
var argv = __webpack_require__(/*! minimist */ 10)(process.argv.slice(2));
var setup = __webpack_require__(/*! ./middlewares/frontendMiddleware */ 9);
var isDev = "development" !== 'production';
var ngrok = isDev && {"NODE_ENV":"development"}.ENABLE_TUNNEL || argv.tunnel ? __webpack_require__(/*! ngrok */ 11) : false;
var resolve = __webpack_require__(/*! path */ 0).resolve;
// If you need a backend, e.g. an API, add your custom backend-specific middleware here
// app.use('/api', myApi);
// In production we need to pass these values in instead of relying on webpack
var app = setup(express(), {
outputPath: resolve(process.cwd(), 'build'),
publicPath: '/'
});
// get the intended port number, use port 3000 if not provided
var port = argv.port || {"NODE_ENV":"development"}.PORT || 3000;
// Start your app.
module.exports = function () {
console.log('server callback');
app.listen(port, function (err) {
console.log('server callback');
if (err) {
return logger.error(err.message);
}
// Connect to ngrok in dev mode
if (ngrok) {
ngrok.connect(port, function (innerErr, url) {
if (innerErr) {
return logger.error(innerErr);
}
logger.appStarted(port, url);
});
} else {
logger.appStarted(port);
}
});
};
/***/ },
/* 18 */
/*!****************************************************!*\
!*** ./~/css-loader!./~/sanitize.css/sanitize.css ***!
\****************************************************/
/***/ function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ./../css-loader/lib/css-base.js */ 5)();
// imports
// module
exports.push([module.i, "/*! sanitize.css v3.3.0 | CC0 1.0 Public Domain | github.com/10up/sanitize.css */\n\n/* Latest tested: Android 6, Chrome 48, Edge 13, Firefox 44, Internet Explorer 11, iOS 9, Opera 35, Safari 9, Windows Phone 8.1 */\n\n/*\n * Normalization\n */\n\nabbr[title] {\n\ttext-decoration: underline; /* Chrome 48+, Edge 12+, Internet Explorer 11-, Safari 9+ */\n\ttext-decoration: underline dotted; /* Firefox 40+ */\n}\n\naudio:not([controls]) {\n\tdisplay: none; /* Chrome 44-, iOS 8+, Safari 9+ */\n}\n\nb,\nstrong {\n\tfont-weight: bolder; /* Edge 12+, Safari 6.2+, and Chrome 18+ */\n}\n\nbutton {\n\t-webkit-appearance: button; /* iOS 8+ */\n\toverflow: visible; /* Internet Explorer 11- */\n}\n\nbutton,\ninput {\n}\n\nbutton::-moz-focus-inner, input::-moz-focus-inner {\n\tborder: 0;/* Firefox 4+ */\n\tpadding: 0;/* Firefox 4+ */\n}\n\nbutton:-moz-focusring, input:-moz-focusring {\n\toutline: 1px dotted ButtonText;/* Firefox 4+ */\n}\n\nbutton,\nselect {\n\ttext-transform: none; /* Firefox 40+, Internet Explorer 11- */\n}\n\ndetails {\n\tdisplay: block; /* Edge 12+, Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+ */\n}\n\nhtml {\n\t-ms-overflow-style: -ms-autohiding-scrollbar; /* Edge 12+, Internet Explorer 11- */\n\toverflow-y: scroll; /* All browsers without overlaying scrollbars */\n\t-webkit-text-size-adjust: 100%; /* iOS 8+, Windows Phone 8.1+ */\n}\n\nhr {\n\toverflow: visible; /* Internet Explorer 11-, Edge 12+ */\n}\n\ninput {\n\t-webkit-border-radius: 0 /* iOS 8+ */\n}\n\ninput[type=\"button\"],\n\tinput[type=\"reset\"],\n\tinput[type=\"submit\"] {\n\t-webkit-appearance: button;/* iOS 8+ */\n}\n\ninput[type=\"number\"] {\n\twidth: auto;/* Firefox 36+ */\n}\n\ninput[type=\"search\"] {\n\t-webkit-appearance: textfield;/* Chrome 45+, Safari 9+ */\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\n\t\tinput[type=\"search\"]::-webkit-search-decoration {\n\t-webkit-appearance: none;/* Chrome 45+, Safari 9+ */\n}\n\nmain {\n\tdisplay: block; /* Android 4.3-, Internet Explorer 11-, Windows Phone 8.1+ */\n}\n\npre {\n\toverflow: auto; /* Internet Explorer 11- */\n}\n\nprogress {\n\tdisplay: inline-block; /* Internet Explorer 11-, Windows Phone 8.1+ */\n}\n\nsummary {\n\tdisplay: block; /* Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+ */\n}\n\nsvg:not(:root) {\n\toverflow: hidden; /* Internet Explorer 11- */\n}\n\ntemplate {\n\tdisplay: none; /* Android 4.3-, Internet Explorer 11-, iOS 7-, Safari 7-, Windows Phone 8.1+ */\n}\n\ntextarea {\n\toverflow: auto; /* Edge 12+, Internet Explorer 11- */\n}\n\n[hidden] {\n\tdisplay: none; /* Internet Explorer 10- */\n}\n\n/*\n * Universal inheritance\n */\n\n*,\n:before,\n:after {\n\tbox-sizing: inherit;\n}\n\n* {\n\tfont-size: inherit;\n\tline-height: inherit;\n}\n\n:before,\n:after {\n\ttext-decoration: inherit;\n\tvertical-align: inherit;\n}\n\nbutton,\ninput,\nselect,\ntextarea {\n\tfont-family: inherit;\n\tfont-style: inherit;\n\tfont-weight: inherit;\n}\n\n\n\n/*\n * Opinionated defaults\n */\n\n/* specify the margin and padding of all elements */\n\n* {\n\tmargin: 0;\n\tpadding: 0;\n}\n\n/* specify the border style and width of all elements */\n\n*,\n:before,\n:after {\n\tborder-style: solid;\n\tborder-width: 0;\n}\n\n/* remove the tapping delay from clickable elements */\n\na,\narea,\nbutton,\ninput,\nlabel,\nselect,\ntextarea,\n[tabindex] {\n\t-ms-touch-action: manipulation;\n\t touch-action: manipulation;\n}\n\n/* specify the standard appearance of selects */\n\nselect {\n\t-moz-appearance: none; /* Firefox 40+ */\n\t-webkit-appearance: none /* Chrome 45+ */\n}\n\nselect::-ms-expand {\n\tdisplay: none;/* Edge 12+, Internet Explorer 11- */\n}\n\nselect::-ms-value {\n\tcolor: currentColor;/* Edge 12+, Internet Explorer 11- */\n}\n\n/* use current current as the default fill of svg elements */\n\nsvg {\n\tfill: currentColor;\n}\n\n/* specify the progress cursor of updating elements */\n\n[aria-busy=\"true\"] {\n\tcursor: progress;\n}\n\n/* specify the pointer cursor of trigger elements */\n\n[aria-controls] {\n\tcursor: pointer;\n}\n\n/* specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */\n\n[aria-disabled] {\n\tcursor: default;\n}\n\n/* specify the style of visually hidden yet accessible elements */\n\n[hidden][aria-hidden=\"false\"] {\n\tclip: rect(0 0 0 0);\n\tdisplay: inherit;\n\tposition: absolute\n}\n\n[hidden][aria-hidden=\"false\"]:focus {\n\tclip: auto;\n}\n\n\n\n/*\n * Configurable defaults\n */\n\n/* specify the background repeat of all elements */\n\n* {\n\tbackground-repeat: no-repeat;\n}\n\n/* specify the root styles of the document */\n\n:root {\n\tbackground-color: #ffffff;\n\tbox-sizing: border-box;\n\tcolor: #000000;\n\tcursor: default;\n\tfont: 100%/1.5 sans-serif;\n}\n\n/* specify the text decoration of anchors */\n\na {\n\ttext-decoration: none;\n}\n\n/* specify the alignment of media elements */\n\naudio,\ncanvas,\niframe,\nimg,\nsvg,\nvideo {\n\tvertical-align: middle;\n}\n\n/* specify the coloring of form elements */\n\nbutton,\ninput,\nselect,\ntextarea {\n\tbackground-color: transparent;\n\tcolor: inherit;\n}\n\n/* specify the minimum height of form elements */\n\nbutton,\n[type=\"button\"],\n[type=\"date\"],\n[type=\"datetime\"],\n[type=\"datetime-local\"],\n[type=\"email\"],\n[type=\"month\"],\n[type=\"number\"],\n[type=\"password\"],\n[type=\"reset\"],\n[type=\"search\"],\n[type=\"submit\"],\n[type=\"tel\"],\n[type=\"text\"],\n[type=\"time\"],\n[type=\"url\"],\n[type=\"week\"],\nselect,\ntextarea {\n\tmin-height: 1.5em;\n}\n\n/* specify the font family of code elements */\n\ncode,\nkbd,\npre,\nsamp {\n\tfont-family: monospace, monospace;\n}\n\n/* specify the list style of nav lists */\n\nnav ol,\nnav ul {\n\tlist-style: none;\n}\n\n/* specify the font size of small elements */\n\nsmall {\n\tfont-size: 75%;\n}\n\n/* specify the border styling of tables */\n\ntable {\n\tborder-collapse: collapse;\n\tborder-spacing: 0;\n}\n\n/* specify the resizability of textareas */\n\ntextarea {\n\tresize: vertical;\n}\n\n/* specify the background color, font color, and drop shadow of text selections */\n\n::-moz-selection {\n\tbackground-color: #b3d4fc; /* required when declaring ::selection */\n\tcolor: #ffffff;\n\ttext-shadow: none;\n}\n\n::selection {\n\tbackground-color: #b3d4fc; /* required when declaring ::selection */\n\tcolor: #ffffff;\n\ttext-shadow: none;\n}\n", ""]);
// exports
/***/ },
/* 19 */
/*!*****************************************************************************************************************************************************************!*\
!*** ./~/css-loader?localIdentName=[local]__[path][name]__[hash:base64:5]&modules&importLoaders=1&sourceMap!./~/postcss-loader!./app/containers/App/styles.css ***!
\*****************************************************************************************************************************************************************/
/***/ function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ./../../../~/css-loader/lib/css-base.js */ 5)();
// imports
// module
exports.push([module.i, "/* Global styles */\r\n\r\nhtml,\r\nbody {\r\n height: 100%;\r\n width: 100%;\r\n}\r\n\r\nbody {\r\n font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\nbody.fontLoaded__app-containers-App-styles__JIg_X {\r\n font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\n#app {\r\n background-color: #FAFAFA;\r\n min-height: 100%;\r\n min-width: 100%;\r\n}\r\n\r\n.wrapper__app-containers-App-styles__3jlCh {\r\n max-width: 800px;\r\n margin: 0 auto;\r\n display: -ms-flexbox;\r\n display: flex;\r\n min-height: 100%;\r\n padding: 0 16px;\r\n -ms-flex-direction: column;\r\n flex-direction: column;\r\n}\r\n\r\n.logoWrapper__app-containers-App-styles__27cHX {\r\n padding: 2em 0;\r\n}\r\n\r\n.logo__app-containers-App-styles__32EV1 {\r\n width: 100%;\r\n margin: 0 auto;\r\n display: block;\r\n}\r\n", "", {"version":3,"sources":["/./app/containers/App/styles.css"],"names":[],"mappings":"AAAA,mBAAmB;;AAEnB;;EAEE,aAAa;EACb,YAAY;CACb;;AAED;EACE,4DAA4D;CAC7D;;AAED;EACE,yEAAyE;CAC1E;;AAED;EACE,0BAA0B;EAC1B,iBAAiB;EACjB,gBAAgB;CACjB;;AAED;EACE,iBAAkC;EAClC,eAAe;EACf,qBAAc;EAAd,cAAc;EACd,iBAAiB;EACjB,gBAAgB;EAChB,2BAAuB;MAAvB,uBAAuB;CACxB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,YAAY;EACZ,eAAe;EACf,eAAe;CAChB","file":"styles.css","sourcesContent":["/* Global styles */\r\n\r\nhtml,\r\nbody {\r\n height: 100%;\r\n width: 100%;\r\n}\r\n\r\nbody {\r\n font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\nbody.fontLoaded {\r\n font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\n:global(#app) {\r\n background-color: #FAFAFA;\r\n min-height: 100%;\r\n min-width: 100%;\r\n}\r\n\r\n.wrapper {\r\n max-width: calc(768px + 16px * 2);\r\n margin: 0 auto;\r\n display: flex;\r\n min-height: 100%;\r\n padding: 0 16px;\r\n flex-direction: column;\r\n}\r\n\r\n.logoWrapper {\r\n padding: 2em 0;\r\n}\r\n\r\n.logo {\r\n width: 100%;\r\n margin: 0 auto;\r\n display: block;\r\n}\r\n"],"sourceRoot":"webpack://"}]);
// exports
exports.locals = {
"fontLoaded": "fontLoaded__app-containers-App-styles__JIg_X",
"wrapper": "wrapper__app-containers-App-styles__3jlCh",
"logoWrapper": "logoWrapper__app-containers-App-styles__27cHX",
"logo": "logo__app-containers-App-styles__32EV1"
};
/***/ },
/* 20 */
/*!*************************************!*\
!*** ./~/sanitize.css/sanitize.css ***!
\*************************************/
/***/ function(module, exports, __webpack_require__) {
// fake-style-loader: Loads css
var content = __webpack_require__(/*! !./../css-loader!./sanitize.css */ 18);
if (typeof content === "string") content = [[module.i, content, ""]];
module.exports = content.locals || {}
module.exports.source = content
/***/ },
/* 21 */
/*!***************************************!*\
!*** ./app/containers/App/styles.css ***!
\***************************************/
/***/ function(module, exports, __webpack_require__) {
// fake-style-loader: Loads css
var content = __webpack_require__(/*! !./../../../~/css-loader?localIdentName=[local]__[path][name]__[hash:base64:5]&modules&importLoaders=1&sourceMap!./../../../~/postcss-loader!./styles.css */ 19);
if (typeof content === "string") content = [[module.i, content, ""]];
module.exports = content.locals || {}
module.exports.source = content
/***/ },
/* 22 */
/*!*********************************************!*\
!*** ./app/containers/App/banner-metal.jpg ***!
\*********************************************/
/***/ function(module, exports, __webpack_require__) {
module.exports = __webpack_require__.p + "f3b26cc54fe4588671576d6b115a2a1d.jpg";
/***/ },
/* 23 */
/*!****************************!*\
!*** ./server/middlewares ***!
\****************************/
/***/ function(module, exports) {
function webpackEmptyContext(req) {
throw new Error("Cannot find module '" + req + "'.");
}
webpackEmptyContext.keys = function() { return []; };
webpackEmptyContext.resolve = webpackEmptyContext;
module.exports = webpackEmptyContext;
webpackEmptyContext.id = 23;
/***/ },
/* 24 */
/*!************************!*\
!*** external "chalk" ***!
\************************/
/***/ function(module, exports) {
module.exports = require("chalk");
/***/ },
/* 25 */
/*!*******************************!*\
!*** external "components/A" ***!
\*******************************/
/***/ function(module, exports) {
module.exports = require("components/A");
/***/ },
/* 26 */
/*!************************************!*\
!*** external "components/Footer" ***!
\************************************/
/***/ function(module, exports) {
module.exports = require("components/Footer");
/***/ },
/* 27 */
/*!*********************************!*\
!*** external "components/Img" ***!
\*********************************/
/***/ function(module, exports) {
module.exports = require("components/Img");
/***/ },
/* 28 */
/*!******************************!*\
!*** external "compression" ***!
\******************************/
/***/ function(module, exports) {
module.exports = require("compression");
/***/ },
/* 29 */
/*!*********************!*\
!*** external "ip" ***!
\*********************/
/***/ function(module, exports) {
module.exports = require("ip");
/***/ },
/* 30 */
/*!**********************************!*\
!*** external "postcss-cssnext" ***!
\**********************************/
/***/ function(module, exports) {
module.exports = require("postcss-cssnext");
/***/ },
/* 31 */
/*!********************************!*\
!*** external "postcss-focus" ***!
\********************************/
/***/ function(module, exports) {
module.exports = require("postcss-focus");
/***/ },
/* 32 */
/*!***********************************!*\
!*** external "postcss-reporter" ***!
\***********************************/
/***/ function(module, exports) {
module.exports = require("postcss-reporter");
/***/ },
/* 33 */
/*!************************!*\
!*** external "react" ***!
\************************/
/***/ function(module, exports) {
module.exports = require("react");
/***/ },
/* 34 */
/*!************************************!*\
!*** external "universal-webpack" ***!
\************************************/
/***/ function(module, exports) {
module.exports = require("universal-webpack");
/***/ },
/* 35 */
/*!*****************************************!*\
!*** external "webpack-dev-middleware" ***!
\*****************************************/
/***/ function(module, exports) {
module.exports = require("webpack-dev-middleware");
/***/ },
/* 36 */
/*!*****************************************!*\
!*** external "webpack-hot-middleware" ***!
\*****************************************/
/***/ function(module, exports) {
module.exports = require("webpack-hot-middleware");
/***/ }
/******/ ]);
//# sourceMappingURL=server.js.map
from universal-webpack.
/***/ },
/* 27 */
/*!*********************************!*\
!*** external "components/Img" ***!
\*********************************/
/***/ function(module, exports) {
module.exports = require("components/Img");
Of course it throws an error.
Why are your components
marked as an external dependency?
Post your console.log(JSON.stringify(resulting_server_webpack_configuration, null, 2))
from universal-webpack.
Speaking about two commands:
When I try to run node server/start-server
after separatly runnning webpack command simply nothing happens
from universal-webpack.
This could be due to the DLL Plugin.
The DLL Plugin works by splitting your code into two parts: internal hot reloaded part and "external" part compiled as a DLL.
You may also want to examine your configuration.entry.vendor
array and verify that components isn't there.
That's as much as I can tell about this issue.
from universal-webpack.
Thank you very much. Can you provide some sample server side webpack.configuration? As I understand, this library takes client configuration and transforms it to suitable server configuration automatically. What transforms do you apply to client webpack configuration?
from universal-webpack.
this library takes client configuration and transforms it to suitable server configuration automatically.
yes
What transforms do you apply to client webpack configuration?
see the sources
https://github.com/halt-hammerzeit/universal-webpack/blob/master/source/server%20configuration.js
from universal-webpack.
Can you provide some very simple webpack.config, that is analog of your code in library? I am. Net developer and I hardly understand what happens in your library. I need some simple guidness
from universal-webpack.
I don't understand what you're asking
from universal-webpack.
Sorry. Maybe it is my English. Can you provide some simple webpack client configuration with styles, and result configuration for server rendering (in fact, configuration object which is result of transformation of your library.) I have problem with styles on the server side. If you will see the boilerplate, author imports 'sanitize.css' in main app entry. I am always getting unexpected token error, when I try to use my own webpack.config for server. But your library seems to work. How did you achieved this?
from universal-webpack.
Can you provide some simple webpack client configuration with styles, and result configuration for server rendering (in fact, configuration object which is result of transformation of your library.)
The server configuration is gonna be exactly what this code does:
https://github.com/halt-hammerzeit/universal-webpack/blob/master/source/server%20configuration.js
You can console.log()
it yourself.
I am always getting unexpected token error, when I try to use my own webpack.config for server.
Of course
But your library seems to work.
Of course it does
How did you achieved this?
See the aforementioned hyperlink
from universal-webpack.
Thank you again
from universal-webpack.
Related Issues (20)
- webpack-dev-server does not support es6 modules HOT 2
- support css-loader v2 HOT 7
- Error: [universal-webpack] Your server source file must export a function. Got [ 'libserver' ] HOT 7
- typescript signatures for clientConfiguration/serverConfiguration do not include options HOT 2
- Advanced config HOT 5
- webpack-chunks.json not found HOT 1
- How to config webpack-chunks.json path? HOT 3
- Compatibility with css-loader@3 broken HOT 2
- parser: { requireEnsure: false } } HOT 1
- support css loader v3 HOT 1
- [Question] SSR Support for Files like png and svg HOT 3
- webpack-isomorphic-tools to universal-webpack
- extract-text-webpack-plugin deprecated HOT 10
- DeprecationWarning HOT 2
- Flash of Unstyled Content with Webpack 4 HOT 2
- Nodemon causes Error 503 on Hot reload HOT 8
- Using dynamic imports causes the output filename to be the first encounted chunk name when generating server bundle HOT 4
- Fails to run server using DllPlugin, "ReferenceError: vendor is not defined"
- webpack-serve has been DEPRECATED HOT 2
- Readme is difficult to follow HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from universal-webpack.