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

Although #3265 raises this point too, but does not focus on it as the problem to address.

Expected Behavior

The README specifies

Warning: Adding loaders to support new file types (css, less, svg, etc.) is not recommended because only the client code gets bundled via webpack and thus it won't work on the initial server rendering

However many of the repo's examples rely on custom webpack configurations and loaders to produce their desired outcomes.

Eg: with-global-stylesheet requires a bunch of loaders use: ['babel-loader', 'raw-loader', 'postcss-loader'] to compile and output the files into the dist dir.

Then, in my journey for external global and scoped scss -> css configuration/pipeline I came across this thread.

@giuseppeg #2413 (comment)

It seems that in the example webpack is doing the magic, but if it would be very cool if that works for ssr too. Have you also tried without the global property on the style tag?

@timneutkens #2413 (comment)

This is really cool 😲

giuseppeg again - #2413 (comment)

Alright @mocheng it works indeed!

These comments in this thread have me confused about this Webpack warning.

Context

Ultimately what I would like to understand is the following:

what are the implications of having Webpack configurations? Can the usage of Babel and Webpack in SSR and client-side be made more clear?

can we have more guidelines around the examples to make them more easily composed? Eg: with-jest does not play nice with any examples that rely on custom Webpack, specifically any styling examples.

Issue 2:
Feature Request

The Problem

Next.js can't be used for apps running on Smart TV (e.g., on Samsung Tizen platform) or for other client-side rendered apps with dynamic data requirements.

It would be great if Next.js could be used for client-side only apps and still support dynamic routing and automatic code-splitting.

The Solution

SPA Mode

Next.js introduces a mode for building app as a single-page application (SPA). getInitialProps works just like before, but is executed on the client only.

The new option for SPA mode is added to next.config.js:

module.exports = {
…,
spa: true
};

Using SPA and SSG

The open question is how to handle both SPA mode and SSG. It looks like it's still possible to do it on a per-page basis (suggested in this RFC). Although there's no clear benefit of using a hybrid app for Smart TV use case as TV apps are hosted locally on the device.

Considered Alternatives

Static export is not an option because the app has dynamic data requirements.

SSR doesn't make sense because the app is hosted locally on the TV device. It's not a technical option either because Node.js isn't available on the TV.

So, the alternative that is left is running the app without Next.js.

Additional context

This RFC mentions the support of "client-side only applications" as one of the goals.

Nuxt.js supports a dedicated mode for building SPA.

Smart TV Apps 101

Smart TV apps are web apps that are executed by TV's browser engine:

The developer creates an application bundle: styles, scripts, images, index.html, certificates, TV config file, etc.

The bundle is submitted for review to TV's app store.

Upon successful review, the app is added to the app store and is available for download.

The user downloads the app.

The app is hosted by the TV and is run by the user.

Some Smart TV platforms like webOS TV support hosted web apps, others like Tizen prohibit such kind of apps.