diff --git a/examples/with-semantic-ui/.nowignore b/examples/with-semantic-ui/.nowignore new file mode 100644 index 00000000..5a4be6a0 --- /dev/null +++ b/examples/with-semantic-ui/.nowignore @@ -0,0 +1,5 @@ +node_modules +.next +/*.* +!package.json +!next.config.js diff --git a/examples/with-semantic-ui/next.config.js b/examples/with-semantic-ui/next.config.js index 1dade337..03a5d211 100644 --- a/examples/with-semantic-ui/next.config.js +++ b/examples/with-semantic-ui/next.config.js @@ -1,20 +1,20 @@ -const withCss = require('@zeit/next-css') +const withCSS = require('@zeit/next-css') -module.exports = withCss({ +module.exports = withCSS({ + target: 'serverless', webpack (config) { config.module.rules.push({ - test: /\.(png|svg|eot|otf|ttf|woff|woff2)$/i, + test: /\.(png|svg|eot|otf|ttf|woff|woff2)$/, use: { loader: 'url-loader', options: { limit: 8192, - publicPath: './', - outputPath: 'static/css/', + publicPath: '/_next/static/', + outputPath: 'static/', name: '[name].[ext]' } } }) - return config } }) diff --git a/examples/with-semantic-ui/now.json b/examples/with-semantic-ui/now.json new file mode 100644 index 00000000..65dfadc7 --- /dev/null +++ b/examples/with-semantic-ui/now.json @@ -0,0 +1,5 @@ +{ + "version": 2, + "name": "with-semantic-ui", + "builds": [{ "src": "package.json", "use": "@now/next" }] +} diff --git a/examples/with-semantic-ui/package.json b/examples/with-semantic-ui/package.json index 2ed2d4a2..340a3a32 100644 --- a/examples/with-semantic-ui/package.json +++ b/examples/with-semantic-ui/package.json @@ -3,18 +3,21 @@ "version": "1.0.0", "scripts": { "dev": "next", - "build": "next build", + "now-build": "next build", "start": "next start" }, "dependencies": { - "@zeit/next-css": "^1.0.1", - "file-loader": "^1.1.11", - "next": "latest", + "next": "canary", "react": "^16.7.0", "react-dom": "^16.7.0", - "semantic-ui-css": "^2.3.3", - "semantic-ui-react": "^0.82.0", - "url-loader": "^1.0.1" + "semantic-ui-css": "^2.4.1", + "semantic-ui-react": "^0.84.0" + }, + "devDependencies": { + "@zeit/next-css": "^1.0.1", + "file-loader": "^3.0.1", + "url-loader": "^1.1.2", + "webpack": "^4.29.0" }, "license": "ISC" } diff --git a/examples/with-semantic-ui/pages/LargeImage.png b/examples/with-semantic-ui/pages/LargeImage.png new file mode 100644 index 00000000..19de6c43 Binary files /dev/null and b/examples/with-semantic-ui/pages/LargeImage.png differ diff --git a/examples/with-semantic-ui/pages/SmallImage.png b/examples/with-semantic-ui/pages/SmallImage.png new file mode 100644 index 00000000..edf0cb07 Binary files /dev/null and b/examples/with-semantic-ui/pages/SmallImage.png differ diff --git a/examples/with-semantic-ui/pages/_document.js b/examples/with-semantic-ui/pages/_document.js deleted file mode 100644 index 58fa5204..00000000 --- a/examples/with-semantic-ui/pages/_document.js +++ /dev/null @@ -1,15 +0,0 @@ -import Document, { Head, Main, NextScript } from 'next/document' - -export default class MyDocument extends Document { - render () { - return ( - -
- -- We have found the following gravatar image associated with your - e-mail address. -
-Is it okay to use this photo?
++ Larger content should be still availble as a fallback + to fileLoader but + it should not polute /.next/static/css folder. + You should see two images below. + One, smaller, loaded as data url, and one, bigger, loaded + via url. +
++ A small image should be loaded as data url: {SmallImage.substr(0, 100)}... +
++ A large image should be loaded as a url: {LargeImage} +
++ You should also still be able to load regular css. + This text should have border. +
+