Issue 1:
Bug report

Describe the bug

When using _app.js page for common stuff (like creating redux store) - these libraries are duplicated between pages.

To Reproduce

Checkout https://github.com/cherniavskii/nextjs-app-code-splitting-reproduction locally

Run npm install

Run npm run analyze

See bundle analyzer report

Expected behavior

redux and react-redux are bundled once.

Actual behaviour:

redux and react-redux are bundled many times - once in _app.js and in every page which is connected with Redux (index.js and home.js)

Screenshots

System information

OS: Windows

Browser (if applies) N/A

Version of Next.js: 6.1.0

Additional context

This app contains 6 pages:

_app.js - initializes redux store

index.js - connects with redux store

home.js - connects with redux store

about.js - renders single element, doesn't connect with redux

contacts.js - renders single element, doesn't connect with redux

offer.js - renders single element, doesn't connect with redux

This issue reproduces only when most of pages aren't connected with Redux (that's the way how code splitting works in Next.js).

But IMHO _app.js bundle should be treated like the "second main" bundle - since every page is wrapped in _app page.

There's no sense to duplicate libraries bundled in _app, since _app is always loaded

Issue 2:
When running next.js on top of Docker with express my app is not hot reloading. It hot reloads without Docker as expected.

I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

The app should hot reload.

Current Behavior

The app is not hot reloading, nor does the page reflect changes after I manually refresh the page.

Steps to Reproduce (for bugs)

Command:

$ docker run -p 3000:3000 betterpt/patientapp-dev-nextjs:latest

Contents of my Dockerfile:

FROM node:alpine

# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

# Install app dependencies
COPY . /usr/src/app
RUN npm install

EXPOSE 3000

CMD [ "npm", "run", "dev" ]

Contents of my server.js file:

const express = require('express');
const next = require('next');
const webpack = require('webpack');
// const remotedev = require('remotedev-server');
const routes = require('./dist/routes');
const { parse } = require('url');
const minifyJsPlugin = require('babel-minify-webpack-plugin');

const env = process.env.NODE_ENV || 'development';

const app = next({
dev: env === 'development',
dir: `${__dirname}/dist`,
conf: {
webpack: function(config) {
return {
...config,
externals: {
'mapbox-gl': 'mapboxgl',
},
};
},
webpackDevMiddleware: (config) => {
config.watchOptions = {
poll: 1000,
aggregateTimeout: 300,
};
return config
}
},
});

const handler = routes.getRequestHandler(app);

const PORT = 3000;
console.log(PORT);

app
.prepare()
.then(() => {
express()
.get('*', (req, res, next) => {
if (req.url === '/robots.txt') {
return res.sendFile(`${__dirname}/dist/static/robots.txt`);
}
if (req.url === '/video-sitemap.xml') {
return res.sendFile(`${__dirname}/dist/static/video-sitemap.xml`);
}
if (req.url === '/sitemap.xml') {
return res.sendFile(`${__dirname}/dist/static/sitemap.xml`);
}
next();
})
.use(handler)
.listen(PORT);
})
.catch(ex => {
console.error(ex.stack);
process.exit(1);
});

Context

I am unable to run a development environment with Docker.

Your Environment

Tech
Version

next
4.0

node
8.40

OS
macOS High Sierra

browser
Chrome

etc