diff --git a/examples/with-noscript/README.md b/examples/with-noscript/README.md new file mode 100644 index 00000000..4dbc1d86 --- /dev/null +++ b/examples/with-noscript/README.md @@ -0,0 +1,47 @@ +[![Deploy to now](https://deploy.now.sh/static/button.svg)](https://deploy.now.sh/?repo=https://github.com/zeit/next.js/tree/master/examples/with-noscript) + +# Noscript example + +## How to use + +Download the example [or clone the repo](https://github.com/zeit/next.js): + +## Development +Install it and run: + +**npm** +```bash +npm install +npm run dev +``` + +**yarn** +```bash +yarn install +yarn run dev +``` + +## Production +**npm** +```bash +npm install +npm run build +npm start +``` + +**yarn** +```bash +yarn install +yarn run build +yarn start +``` + +Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download)) + +```bash +now +``` + +## About example + +This example show you how to use `` with image resource in next.js diff --git a/examples/with-noscript/components/Noscript.js b/examples/with-noscript/components/Noscript.js new file mode 100644 index 00000000..f7ed7be4 --- /dev/null +++ b/examples/with-noscript/components/Noscript.js @@ -0,0 +1,7 @@ +import React from 'react' +import ReactDOMServer from 'react-dom/lib/ReactDOMServer' + +export default function Noscript (props) { + const staticMarkup = ReactDOMServer.renderToStaticMarkup(props.children) + return +} diff --git a/examples/with-noscript/next.config.js b/examples/with-noscript/next.config.js new file mode 100644 index 00000000..154a275e --- /dev/null +++ b/examples/with-noscript/next.config.js @@ -0,0 +1,10 @@ +module.exports = { + webpack: (config, { dev }) => { + if (!dev) { + config.resolve.alias = { + 'react-dom/server': require.resolve('react-dom/dist/react-dom-server.min.js') + } + } + return config + } +} diff --git a/examples/with-noscript/package.json b/examples/with-noscript/package.json new file mode 100644 index 00000000..24445193 --- /dev/null +++ b/examples/with-noscript/package.json @@ -0,0 +1,16 @@ +{ + "name": "with-noscript", + "version": "1.0.0", + "scripts": { + "dev": "next", + "build": "next build", + "start": "next start" + }, + "dependencies": { + "next": "^3.0.3", + "react": "^15.4.2", + "react-dom": "^15.4.2", + "react-lazyload": "^2.2.7" + }, + "license": "ISC" +} diff --git a/examples/with-noscript/pages/index.js b/examples/with-noscript/pages/index.js new file mode 100644 index 00000000..568d85c5 --- /dev/null +++ b/examples/with-noscript/pages/index.js @@ -0,0 +1,37 @@ +import React from 'react' +import LazyLoad from 'react-lazyload' +import Noscript from '../components/Noscript' + +const images = [ + '/static/img/reactjs.png', + '/static/img/nextjs.png', + '/static/img/vuejs.png', + '/static/img/angular.jpg' +] + +class Index extends React.Component { + static getInitialProps (context) { + const { isServer } = context + return { isServer } + } + render () { + return ( +