Skip to content
Permalink
Browse files

πŸš€ 7.2.0 maintenance (#1293)

* Proper typings

* Don't run eslint for type definitions

* Make less strict and auto infer

* Add back Routes renderFn

* Remove console.log

* Switch to data-prefetch

The prefetch attribute is not an attribute on anchor elements. The preferred way to do custom attributes is using data-* attributes or custom web elements.

When using anchor attributes the only potential candidate would be rel="prefetch", but that is not enabled for anchor elements (only link elements):

https://developer.mozilla.org/en-US/docs/Web/HTTP/Link_prefetching_FAQ

* Format

* Fix inverted option

* Format

* Bump versions within major range

* Add missing configuration

This is a dependency from eslint-config-react-tools but not listed in the dependencies of that package.

* Use browsers configuration from project

This removes the hardcoded browserlists by injecting them from the root path.

This is a "sorta breaking" change, as it changes the defaults from:
- >1%,
- last 4 versions,
- Firefox ESR,
- not ie < 9

To:

- > 0.5%
- last 2 versions
- Firefox ESR
- not dead

Since this is also a bug, it will be released with the minor release. Adding `browserslist` to your package.json or a config file, instantly fixes this.

#closes #1126

* Formatting

* Remove hardcoded fix

The fix works, which means that the browserlist functionality works. It now pulls it automaticaly from the project (user project) config, or defaults to "defaults".

* Bump packages and add devPeers

It's common to add peerDependencies as devDependencies. This way, they _will_ be installed on development and thus you can test as if they're really there.

Some of the peerDependencies were missing in the first place.

Additionally, during development, we want to use the local react-static folder module, which is symlinked.

* Remove mapped names, update mocks and fix tests

Now that the configuration returns absolute paths, this updates the tests to also "mock" absolute paths.

* Update template versions

* Update urls to use react-static

Nozzle is no longer owning this repository.

* Update CHANGELOG and add RELEASE

* v7.2.0

* Collapse sites list
  • Loading branch information...
SleeplessByte committed Sep 1, 2019
1 parent 9768cfb commit dbf750c9e8c74a2662060e387c983f11021b31aa
Showing with 5,648 additions and 30,851 deletions.
  1. +6 βˆ’0 .eslintignore
  2. +4 βˆ’2 CHANGELOG.md
  3. +1 βˆ’2 CONTRIBUTING.md
  4. +1 βˆ’1 LICENSE
  5. +5 βˆ’0 README.md
  6. +45 βˆ’0 RELEASE.md
  7. +1 βˆ’1 ROADMAP.md
  8. +1 βˆ’1 archives/old-examples/README.md
  9. +1 βˆ’1 docs/api.md
  10. +1 βˆ’1 docs/concepts.md
  11. +1 βˆ’1 docs/config.md
  12. +2 βˆ’2 docs/guides/aws-lambda.md
  13. +14 βˆ’21 docs/guides/styled-components.md
  14. +2 βˆ’1 docs/plugins/README.md
  15. +1 βˆ’1 docs/plugins/node-api.md
  16. +3 βˆ’2 lerna.json
  17. +5 βˆ’5 netlify-www/_redirects
  18. +11 βˆ’9 package.json
  19. +7 βˆ’7 packages/react-static-plugin-css-modules/package.json
  20. +14 βˆ’11 packages/react-static-plugin-emotion/package.json
  21. +10 βˆ’7 packages/react-static-plugin-evergreen/package.json
  22. +9 βˆ’6 packages/react-static-plugin-jss/package.json
  23. +12 βˆ’8 packages/react-static-plugin-less/package.json
  24. +0 βˆ’6 packages/react-static-plugin-less/src/node.api.js
  25. +6 βˆ’6 packages/react-static-plugin-mdx/package.json
  26. +12 βˆ’8 packages/react-static-plugin-preact/package.json
  27. +12 βˆ’7 packages/react-static-plugin-reach-router/package.json
  28. +1 βˆ’1 packages/react-static-plugin-react-location/README.md
  29. +12 βˆ’7 packages/react-static-plugin-react-location/package.json
  30. +4 βˆ’1 packages/react-static-plugin-react-router/README.md
  31. +14 βˆ’7 packages/react-static-plugin-react-router/package.json
  32. +13 βˆ’9 packages/react-static-plugin-sass/package.json
  33. +5 βˆ’7 packages/react-static-plugin-sass/src/node.api.js
  34. +13 βˆ’5 packages/react-static-plugin-sitemap/package.json
  35. +11 βˆ’10 packages/react-static-plugin-source-filesystem/package.json
  36. +10 βˆ’7 packages/react-static-plugin-styled-components/package.json
  37. +12 βˆ’8 packages/react-static-plugin-stylus/package.json
  38. +0 βˆ’6 packages/react-static-plugin-stylus/src/node.api.js
  39. +2 βˆ’2 packages/react-static-plugin-typescript/README.md
  40. +14 βˆ’12 packages/react-static-plugin-typescript/package.json
  41. +1 βˆ’1 packages/react-static/README.md
  42. +76 βˆ’78 packages/react-static/package.json
  43. +1 βˆ’0 packages/react-static/setupTests.js
  44. +1 βˆ’1 packages/react-static/src/browser/__tests__/index.test.js
  45. +43 βˆ’15 packages/react-static/src/browser/components/Routes.js
  46. +1 βˆ’1 packages/react-static/src/browser/hooks/usePrefetch.js
  47. +111 βˆ’0 packages/react-static/src/browser/index.d.ts
  48. +627 βˆ’87 packages/react-static/src/index.d.ts
  49. +1 βˆ’1 packages/react-static/src/index.js
  50. +24 βˆ’0 packages/react-static/src/static/__mocks__/config.development.mock.js
  51. +26 βˆ’0 packages/react-static/src/static/__mocks__/config.production.mock.js
  52. 0 ...ct-static/src/static/__mocks__/{configWithPluginWithOptions.mock.js β†’ config.with-plugin.mock.js}
  53. +0 βˆ’22 packages/react-static/src/static/__mocks__/defaultConfigDevelopment.mock.js
  54. +0 βˆ’24 packages/react-static/src/static/__mocks__/defaultConfigProduction.mock.js
  55. +12 βˆ’0 packages/react-static/src/static/__mocks__/mock-plugin/browser.api.js
  56. +5 βˆ’0 packages/react-static/src/static/__mocks__/mock-plugin/node.api.js
  57. 0 packages/react-static/src/static/__mocks__/{static.config.mock.js β†’ static.config.js.mock.js}
  58. 0 packages/react-static/src/static/__mocks__/{static.config.mock.jsx β†’ static.config.jsx.mock.jsx}
  59. +9 βˆ’2 packages/react-static/src/static/__tests__/extractTemplates.test.js
  60. +25 βˆ’48 packages/react-static/src/static/__tests__/getConfig.test.js
  61. +1 βˆ’1 packages/react-static/src/static/__tests__/webpack.test.js
  62. +2 βˆ’2 packages/react-static/src/static/components/BodyWithMeta.js
  63. +6 βˆ’3 packages/react-static/src/static/components/HeadWithMeta.js
  64. +1 βˆ’3 packages/react-static/src/static/exportRoute.js
  65. +6 βˆ’2 packages/react-static/src/static/getConfig.js
  66. +0 βˆ’6 packages/react-static/src/static/webpack/rules/cssLoader.js
  67. +1 βˆ’1 packages/react-static/src/static/webpack/rules/fileLoader.js
  68. +16 βˆ’16 packages/react-static/templates/basic/package.json
  69. +15 βˆ’15 packages/react-static/templates/blank/package.json
  70. +0 βˆ’8,763 packages/react-static/templates/blank/yarn.lock
  71. +16 βˆ’16 packages/react-static/templates/stress-test/package.json
  72. +0 βˆ’9,488 packages/react-static/templates/stress-test/yarn.lock
  73. +1 βˆ’1 packages/react-static/templates/typescript/README.md
  74. +16 βˆ’16 packages/react-static/templates/typescript/package.json
  75. +0 βˆ’8,032 packages/react-static/templates/typescript/yarn.lock
  76. +4,306 βˆ’4,007 yarn.lock
@@ -6,3 +6,9 @@ res
plugins
platforms
tmp

*.d.ts

# Packages build into their root
packages/*/node.api.js
packages/*/browser.api.js
@@ -1,6 +1,6 @@
# Changelog

## master
## 7.2.0

### New

@@ -12,6 +12,8 @@
- Remove file inline-ing when the file is larger than an arbitrary size ([#1222](https://github.com/react-static/react-static/pull/1222))
- Fix relative paths when the should have been absolute ([#1250](https://github.com/react-static/react-static/pull/1250), [#1253](https://github.com/react-static/react-static/pull/1253), [#1254](https://github.com/react-static/react-static/pull/1254), [#1272](https://github.com/react-static/react-static/pull/1272) and [#1276](https://github.com/react-static/react-static/pull/1254))
- Fixed issue with react hot loader for IE ([#1274](https://github.com/react-static/react-static/pull/1274))
- Fixed TypeScript definitions ([#1181](https://github.com/react-static/react-static/pull/1181))
- Fixed component passing in `renderProp` of `Routes` ([#1181](https://github.com/react-static/react-static/pull/1181))

## 7.1.0

@@ -757,7 +759,7 @@ Migration tips are listed as sub-items if applicable.

### Features

- Common props returned by `getRouteProps` (props that `===` one another) now promoted to **shared props** and only requested once per session. Learn more in the docs: [Automatic Data and Prop Splitting](https://github.com/nozzle/react-static#automatic-data-and-prop-splitting). Depending on your site, this may significantly decrease site bandwidth and increase both initial page load speed and subsequent page load performance.
- Common props returned by `getRouteProps` (props that `===` one another) now promoted to **shared props** and only requested once per session. Learn more in the docs: [Automatic Data and Prop Splitting](https://github.com/react-static/react-static#automatic-data-and-prop-splitting). Depending on your site, this may significantly decrease site bandwidth and increase both initial page load speed and subsequent page load performance.

## 4.6.0

@@ -8,7 +8,7 @@ We're stoked that you want to help contribute to React Static! Below are a numbe
- Help us write more tests!
- Help us improve our documentation or codebase! You can submit PRs for anything from typos to code comments explaining what a part of the source code does.
- Help others in our [Spectrum Support Community](https://spectrum.chat/react-static)
- Review and help fix [issues](https://github.com/nozzle/react-static/issues)
- Review and help fix [issues](https://github.com/react-static/react-static/issues)

## Getting started with the source code!

@@ -21,4 +21,3 @@ We're stoked that you want to help contribute to React Static! Below are a numbe
- `yarn build` - Builds all packages for release
- `yarn test` - Runs the testing suite for all packages
- `yarn startDocs` - Starts the documentation site in development mode

@@ -1,6 +1,6 @@
MIT License

Copyright (c) 2013-present, Nozzle, Inc.
Copyright (c) 2019 - present, XP Bytes.

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
@@ -30,6 +30,9 @@ React-Static is a fast, lightweight, and powerful progressive static site genera

## Sites Built with React-Static

<details>
<summary>See a list of sites</summary>

- [HeadlessCMS.org](https://headlesscms.org) ([source](https://github.com/netlify/headlesscms.org))
- [StaticGen.com](https://staticgen.com) ([source](https://github.com/netlify/staticgen))
- [Starbucks: Careers Hub](https://www.starbucks.com/careers/)([source](https://twitter.com/codehitchhiker/status/1097558315020832774))
@@ -66,6 +69,8 @@ React-Static is a fast, lightweight, and powerful progressive static site genera
- [Fourth Drive - Music Artist](https://fourthdrive.com) ([source](https://gitlab.com/galmargalit1/fourth-drive))
- [Weekly Best of JavaScript](https://weekly.bestofjs.org/) ([source](https://github.com/bestofjs/bestofjs-weekly))
- [United Income - Company Website](https://unitedincome.com/)
</details>


## Quick Start

@@ -0,0 +1,45 @@
## Tests

```
yarn test
```

## Smoke test basic template

```bash
yarn build
cd src/packages/react-static
```

Now update the blank template to use a local version:

```json
"react-static": "../../react-static"
```

Do the same for each plugin.

```bash
./bin/react-static create
# use blank
cd my-static-site
yarn start
# inspect
yarn build
# inspect
```

## Bump versions in templates

In each template, bump the package versions to the correct version.

## Inspect CHANGELOG.md

Make sure all changes are listed here

## Run lerna publish


@@ -1,6 +1,6 @@
# Roadmap

## V8
## Feature versions

Version 8 will be focused on becoming compatible with async React which includes both suspense and the expected async server-side-renderer that has yet to be released. The goals for this version may include:

@@ -1,3 +1,3 @@
# Looking for the old examples from v5?

Don't worry! We still have them available [here in our git history](https://github.com/nozzle/react-static/tree/280d7c0629c702e843039e9feaa68efa4058303e/archives/old-examples)
Don't worry! We still have them available [here in our git history](https://github.com/react-static/react-static/tree/280d7c0629c702e843039e9feaa68efa4058303e/archives/old-examples)
@@ -38,7 +38,7 @@ The routes that will be rendered are the **routes** returned by the `getRoutes`

### Custom `Routes` Rendering

Occasionally, you may need to render the automatic `<Routes>` component in a custom way. The most common use-case is illustrated in the [animated-routes](https://github.com/nozzle/react-static/tree/master/examples/animated-routes) example transitions. To do this, utilize a render prop:
Occasionally, you may need to render the automatic `<Routes>` component in a custom way. The most common use-case is illustrated in the [animated-routes](https://github.com/react-static/react-static/tree/master/examples/animated-routes) example transitions. To do this, utilize a render prop:

```javascript
import { Root, Routes } from 'react-static'
@@ -21,7 +21,7 @@ React Static also has a very unique and amazing way of requesting the least amou
- **Route Templates** - Under the hood, React Static automatically code splits your route templates for you. Other than assigning templates to routes in your `static.config.js`, you don't have to do anything else! Magic!
- **Route Data** - Each route's `getData` function results in a separate data file for each route being stored as JSON next to the routes HTML on export. This covers the 90% use case for data splitting, but if you want even more control and want to optimize repeated data across routes, you can use the `sharedData` and `createSharedData` api explained below.
- **Site Data** - For data that is needed in every (or most) routes, you can pass it in the `config.getSiteData` function and make it accessible to any page in your entire site!.
- **Manual Code Splitting with Universal** - React Static comes built in with support for [`react-universal-component`](https://github.com/faceyspacey/react-universal-component). This means aside from the automatic code splitting that React Static offers, you can also manually code split very large components if you choose to do so. See the ["About" page in the dynamic-imports example](https://github.com/nozzle/react-static/blob/master/examples/dynamic-imports/src/containers/About.js) to see how it works and how easy it is!
- **Manual Code Splitting with Universal** - React Static comes built in with support for [`react-universal-component`](https://github.com/faceyspacey/react-universal-component). This means aside from the automatic code splitting that React Static offers, you can also manually code split very large components if you choose to do so. See the ["About" page in the dynamic-imports example](https://github.com/react-static/react-static/blob/master/examples/dynamic-imports/src/containers/About.js) to see how it works and how easy it is!

### Shared Route Data (Advanced)

@@ -401,4 +401,4 @@ React Static has tons of other customization possibilities available through the
- Rendering pipeline customizations and transformations for React components, elements, the Document wrapper, etc.
- Head tag injection

Every React Static project can utilize the plugin API locally without needing to create a plugin by creating either `node.api.js` or `browser.api.js` files in the root of your project. See the [Plugin Documentation](https://github.com/nozzle/react-static/tree/master/docs/plugins) for more information!
Every React Static project can utilize the plugin API locally without needing to create a plugin by creating either `node.api.js` or `browser.api.js` files in the root of your project. See the [Plugin Documentation](https://github.com/react-static/react-static/tree/master/docs/plugins) for more information!
@@ -14,13 +14,13 @@ let pathConfig = {}
if (isBuild) {
// Lambda OS is UNIX, and tmpdir() is inside a symlink directory, we need the actual path,
// which is why we use realpathSync
const tmp = require('fs').realpathSync(os.tmpdir());
const tmp = require('fs').realpathSync(os.tmpdir())
pathConfig = {
dist: tmp + '/dist',
temp: tmp + '/tmp',
buildArtifacts: tmp + '/artifacts',
devDist: tmp + '/dev-dist',
assets: tmp + '/dist'
assets: tmp + '/dist',
}
}
@@ -8,10 +8,11 @@ The benefits are:

## There's a plugin for that

Get the plugin and install it according to it's [documentation](https://github.com/nozzle/react-static/tree/master/packages/react-static-plugin-styled-components).
Get the plugin and install it according to it's [documentation](https://github.com/react-static/react-static/tree/master/packages/react-static-plugin-styled-components).

## Let's convert the basic example to use styled components
The basic example can be found [here](https://github.com/nozzle/react-static/tree/280d7c0629c702e843039e9feaa68efa4058303e/packages/react-static/templates/basic).

The basic example can be found [here](https://github.com/react-static/react-static/tree/280d7c0629c702e843039e9feaa68efa4058303e/packages/react-static/templates/basic).

More detailed information on how to use styled components can be found [here](https://www.styled-components.com/docs/api).

@@ -30,7 +31,7 @@ Open `app.js` and remove the `import './app.css'` so we're not using that css an
Import the global style function at the top.

```javascript
import { createGlobalStyle } from "styled-components";
import { createGlobalStyle } from 'styled-components'
```

Insert the css in the global style, this can be done inline or in a separate file.
@@ -57,7 +58,7 @@ const GlobalStyle = createGlobalStyle`
img {
max-width: 100%;
}
`;
`
```

Now add the `GlobalStyle` tag inside our app.
@@ -67,14 +68,10 @@ function App() {
return (
<Root>
<GlobalStyle />
<nav>
...
</nav>
<div className="content">
...
</div>
<nav>...</nav>
<div className="content">...</div>
</Root>
);
)
}
```

@@ -89,11 +86,11 @@ const Nav = styled.nav`
padding: 1rem;
display: inline-block;
}
`;
`
const Content = styled.div`
padding: 1rem;
`;
`
```

And replace the divs in the render function with their new styled replacements.
@@ -103,15 +100,11 @@ function App() {
return (
<Root>
<GlobalStyle />
<Nav>
...
</Nav>
<Content>
...
</Content>
<Nav>...</Nav>
<Content>...</Content>
</Root>
);
)
}
```

And that's it! Enjoy!
And that's it! Enjoy!
@@ -32,6 +32,7 @@ React Static ships with a plugin API to extend React Static's functionality.
### Unofficial Plugins via NPM

- Assets

- [react-static-plugin-favicons](https://www.npmjs.com/package/react-static-plugin-favicons) - Generate (fav)icons in many different sizes for many different platforms, and add them to your site's metadata

- Other
@@ -140,4 +141,4 @@ Only the `plugins` directory will be transformed by react-static's babel runtime

Hence, when distributing your plugin, your plugin **must be ES5 compatible**.

- An example of a plugin compiled before distribution is [react-static-plugin-styled-components](https://github.com/nozzle/react-static/tree/master/react-static-plugin-styled-components).
- An example of a plugin compiled before distribution is [react-static-plugin-styled-components](https://github.com/react-static/react-static/tree/master/react-static-plugin-styled-components).
@@ -138,7 +138,7 @@ const webpackConfig = {
}
```

The source for all default loaders can be found in [webpack/rules/ directory](https://github.com/nozzle/react-static/tree/master/packages/react-static/src/static/webpack/rules).
The source for all default loaders can be found in [webpack/rules/ directory](https://github.com/react-static/react-static/tree/master/packages/react-static/src/static/webpack/rules).

**Note:** Usage of the `oneOf` rule is recommended. This ensures each file is only handled by the first loader it matches, and not any loader. This also makes it easier to reutilize the default loaders, without having to fuss with `excludes`. Here are some examples of how to replace and modify the default loaders:

@@ -2,8 +2,9 @@
"packages": [
"packages/*"
],
"version": "7.1.0",
"version": "7.2.0",
"npmClient": "yarn",
"registry": "https://registry.npmjs.org/",
"useWorkspaces": true
"useWorkspaces": true,
"lerna": "2.0.0-rc.4"
}
@@ -1,5 +1,5 @@
/docs/contributing* https://github.com/nozzle/react-static/tree/master/CONTRIBUTING.md:splat
/docs/changelog* https://github.com/nozzle/react-static/tree/master/CHANGELOG.md:splat
/docs/methods* https://github.com/nozzle/react-static/tree/master/docs/browser.md:splat
/docs/:doc/* https://github.com/nozzle/react-static/tree/master/docs/:doc.md/:splat
/* https://github.com/nozzle/react-static/tree/master/:splat
/docs/contributing* https://github.com/react-static/react-static/tree/master/CONTRIBUTING.md:splat
/docs/changelog* https://github.com/react-static/react-static/tree/master/CHANGELOG.md:splat
/docs/methods* https://github.com/react-static/react-static/tree/master/docs/browser.md:splat
/docs/:doc/* https://github.com/react-static/react-static/tree/master/docs/:doc.md/:splat
/* https://github.com/react-static/react-static/tree/master/:splat
@@ -1,15 +1,15 @@
{
"private": true,
"scripts": {
"releaseNext": "lerna publish prerelease --preid beta --dist-tag next",
"release:next": "lerna publish prerelease --preid beta --dist-tag next",
"release": "lerna publish",
"releaseForce": "lerna publish --force-publish react-static",
"build": "lerna run 'build'",
"watch": "lerna run 'watch' --parallel",
"release:force": "lerna publish --force-publish react-static",
"build": "lerna run build --stream",
"watch": "lerna run watch --parallel",
"start": "yarn watch",
"startDocs": "cd www && yarn && yarn start",
"buildDocs": "cd www && yarn && yarn build",
"serveDocs": "serve www/dist -p 3000",
"start:docs": "cd www && yarn && yarn start",
"build:docs": "cd www && yarn && yarn build",
"serve:docs": "serve www/dist -p 3000",
"test": "yarn format && lerna run test",
"format": "prettier docs/** --write && lerna run format --stream",
"precommit": "yarn format && git add",
@@ -24,7 +24,9 @@
"packages/*"
],
"devDependencies": {
"husky": "^2.5.0",
"lerna": "^3.6.0"
"eslint-config-prettier": "^6.0.0",
"eslint-config-react-tools": "^1.1.7",
"husky": "^3.0.3",
"lerna": "^3.16.4"
}
}
@@ -1,9 +1,9 @@
{
"name": "react-static-plugin-css-modules",
"version": "7.1.0",
"version": "7.2.0",
"description": "A React-Static plugin that adds SSR support for css modules",
"main": "node.api.js",
"repository": "https://github.com/nozzle/react-static.git",
"repository": "https://github.com/react-static/react-static.git",
"author": "Zack Jackson <zack@scriptedAlchemy.com> (https://github.com/ScriptedAlchemy)",
"license": "MIT",
"private": false,
@@ -15,13 +15,13 @@
"preversion": "yarn build"
},
"devDependencies": {
"@babel/cli": "^7.4.3",
"@babel/core": "^7.4.3",
"@babel/preset-env": "^7.4.3"
"@babel/cli": "^7.5.5",
"@babel/core": "^7.5.5",
"@babel/preset-env": "^7.5.5"
},
"dependencies": {
"css-loader": "^2.0.1",
"extract-css-chunks-webpack-plugin": "^4.5.1"
"css-loader": "^2.1.1",
"extract-css-chunks-webpack-plugin": "^4.6.0"
},
"gitHead": "ca9f2162257fe67a8b4ffcbb1350695345940da4"
}

0 comments on commit dbf750c

Please sign in to comment.
You can’t perform that action at this time.