Merge pull request #760 from developit/merge

Merge next back into master
preactjs · Mar 19, 2019 · e4ca195 · e4ca195
2 parents b9fe787 + 01ccf19
commit e4ca195
Show file tree

Hide file tree

Showing 145 changed files with 13,191 additions and 7,651 deletions.
diff --git a/.babelrc b/.babelrc
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1,2 @@
+**/node_modules
+**/tests/output
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,43 @@
+{
+  "extends": [
+    "eslint:recommended",
+    "prettier"
+  ],
+  "parser": "babel-eslint",
+  "env": {
+    "browser": true,
+    "node": true,
+    "es6": true
+  },
+  "plugins": [
+    "babel",
+    "react",
+    "prettier"
+  ],
+  "settings": {
+    "react": {
+      "pragma": "h",
+      "version": "preact"
+    }
+  },
+  "parserOptions": {
+    "ecmaVersion": 2018,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "rules": {
+    "no-console": 1,
+    "no-empty": 0,
+    "semi": 2,
+    "keyword-spacing": 2,
+    "react/no-string-refs": 2,
+    "react/no-find-dom-node": 2,
+    "react/no-is-mounted": 2,
+    "react/jsx-no-comment-textnodes": 2,
+    "react/jsx-curly-spacing": 2,
+    "react/jsx-no-undef": 2,
+    "react/jsx-uses-react": 2,
+    "react/jsx-uses-vars": 2
+  }
+}
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
@@ -6,7 +6,6 @@
 
 **Did you add tests for your changes?**
 
-
 **Summary**
 
 <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? -->

diff --git a/.github/issue_template.md b/.github/issue_template.md
@@ -1,7 +1,7 @@
 <!-- Please don't delete this template -->
 <!-- Before creating an issue please make sure you are using the latest version of preact-cli. -->
 
-**Do you want to request a *feature* or report a *bug*?**
+**Do you want to request a _feature_ or report a _bug_?**
 
 **What is the current behaviour?**
 
@@ -14,6 +14,7 @@
 **If this is a feature request, what is motivation or use case for changing the behaviour?**
 
 **Please mention other relevant information.**
+
 - Node version
 - npm version
 - Operating system

diff --git a/.gitignore b/.gitignore
@@ -1,11 +1,11 @@
-/node_modules
-/lib
-/examples/*/build
-/tests/output
 .DS_Store
-npm-debug.log
-key.pem
-cert.pem
+node_modules
 lighthouse.*/
-tmp-*.json
 package-lock.json
+**/tests/output
+tmp-*.json
+*.log
+*.pem
+
+.idea/
+.vscode
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,3 @@
+**/node_modules
+**/tests/output
+**/package.json
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1,8 @@
+{
+	"trailingComma": "es5",
+	"tabWidth": 2,
+	"semi": true,
+	"useTabs": true,
+	"singleQuote": true,
+	"endOfLine": "lf"
+}
diff --git a/.travis.yml b/.travis.yml
@@ -7,12 +7,15 @@ addons:
 
 language: node_js
 node_js:
-  - 6
   - 8
 
+git:
+  depth: 1
+
 branches:
   only:
     - master
+    - next
 
 cache:
   yarn: true
@@ -21,10 +24,8 @@ cache:
     - node_modules
 
 before_script:
-- export LIGHTHOUSE_CHROMIUM_PATH=`which google-chrome-stable`
-# - if [ "$TRAVIS_BRANCH" = "master" ]; then export SKIP_INSTALL=true; export WITH_LOG=true; fi
-- if [ "$TRAVIS_BRANCH" = "master" ]; then export WITH_LOG=true; fi
+  - export WITH_LOG=true
+  - export LIGHTHOUSE_CHROMIUM_PATH=`which google-chrome-stable`
 
 script:
-- npm run lint
-- npm run test -- --verbose
+  - yarn test
diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
@@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a professional setting
 
 ## Our Responsibilities
 

diff --git a/README.md b/README.md
@@ -1,4 +1,4 @@
-# preact-cli [![Build Status](https://travis-ci.org/developit/preact-cli.svg?branch=master)](https://travis-ci.org/developit/preact-cli) [![NPM Downloads](https://img.shields.io/npm/dm/preact-cli.svg?style=flat)](https://www.npmjs.com/package/preact-cli) [![NPM Version](https://img.shields.io/npm/v/preact-cli.svg?style=flat)](https://www.npmjs.com/package/preact-cli) [![Lighthouse score: 100/100](https://lighthouse-badge.appspot.com/?score=100)](https://github.com/developit/preact-cli)
+# preact-cli [![Build Status](https://travis-ci.org/developit/preact-cli.svg?branch=master)](https://travis-ci.org/developit/preact-cli) [![NPM Downloads](https://img.shields.io/npm/dm/preact-cli.svg?style=flat)](https://www.npmjs.com/package/preact-cli) [![NPM Version](https://img.shields.io/npm/v/preact-cli.svg?style=flat)](https://www.npmjs.com/package/preact-cli)
 
 > Start building a [Preact] Progressive Web App in seconds 🔥
 
@@ -25,10 +25,6 @@
 ```sh
 $ npm install -g preact-cli
 ```
-or
-```sh
-$ yarn global add preact-cli
-```
 
 ### Usage
 
@@ -37,6 +33,7 @@ $ preact create <template-name> <project-name>
 ```
 
 Example:
+
 ```sh
 $ preact create default my-project
 ```
@@ -109,11 +106,10 @@ $ preact watch
   --cwd         A directory to use instead of $PWD.              [string]   [default: .]
   --src         Entry file (index.js)                            [string]   [default: "src"]
   --port, -p    Port to start a server on                        [string]   [default: "8080"]
-  --host, -H    Hostname to start a server on                    [string]   [default: "0.0.0.0"]
+  --host,       Hostname to start a server on                    [string]   [default: "0.0.0.0"]
   --https       Use HTTPS?                                       [boolean]  [default: false]
   --prerender   Pre-render static app content on initial build   [boolean]  [default: false]
-  --template    Path to template used by webpack                 [string]   [default: none]
-  --config, c   Path to custom preact.config.js                  [string]   [default: none]
+  --rhl         Enable react hot loader                          [boolean]  [default: false]
 ```
 
 Note:
@@ -162,6 +158,7 @@ npm run serve -- --server config
 Preact CLI in order to follow [PRPL] pattern renders initial route (`/`) into generated static `index.html` - this ensures that users get to see your page before any JavaScript is run, and thus providing users with slow devices or poor connection your website's content much faster.
 
 Preact CLI does this by rendering your app inside node - this means that we don't have access to DOM or other global variables available in browsers, similar how it would be in server-side rendering scenarios. In case you need to rely on browser APIs you could:
+
 - drop out of prerendering by passing `--no-prerender` flag to `preact build`,
 - write your code in a way that supports server-side rendering by wrapping code that requires browser's APIs in conditional statements `if (typeof window !== "undefined") { ... }` ensuring that on server those lines of code are never reached. Alternatively you could use a helper library like [window-or-global](https://www.npmjs.com/package/window-or-global).
 
@@ -177,14 +174,11 @@ You may customize your list of supported browser versions by declaring a [`"brow
 
 By default, `preact-cli` emulates the following config:
 
-```js
-// package.json
+> `package.json`
+
+```json
 {
-  "browserslist": [
-    "> 1%",
-    "IE >= 9",
-    "last 2 versions"
-  ]
+	"browserslist": ["> 1%", "IE >= 9", "last 2 versions"]
 }
 ```
 
@@ -198,46 +192,89 @@ To customize Babel, you have two options:
 
 #### Webpack
 
-To customize webpack create ```preact.config.js``` file which exports function that will change webpack's config.
+To customize preact-cli create a `preact.config.js` or a `preact.config.json` file.
+
+> `preact.config.js`
 
 ```js
-/**
- * Function that mutates original webpack config.
- * Supports asynchronous changes when promise is returned.
- *
- * @param {object} config - original webpack config.
- * @param {object} env - options passed to CLI.
- * @param {WebpackConfigHelpers} helpers - object with useful helpers when working with config.
- **/
-export default function (config, env, helpers) {
-  /** you can change config here **/
-}
+// ... imports or other code up here ...
+
+// these props are both optional
+export default {
+	// you can add preact-cli plugins here
+	plugins: [
+		// either a function
+		// (you'd probably import this because you can use the `webpack` function instead of an inline plugin)
+		function() {},
+		// strings also work (they get imported by preact-cli), useful for the json config
+		'plugin-name',
+		// with options
+		[
+			'plugin-name',
+			{
+				option: true,
+			},
+		],
+	],
+	/**
+	 * Function that mutates the original webpack config.
+	 * Supports asynchronous changes when a promise is returned (or it's an async function).
+	 *
+	 * @param {object} config - original webpack config.
+	 * @param {object} env - options passed to the CLI.
+	 * @param {WebpackConfigHelpers} helpers - object with useful helpers for working with the webpack config.
+	 * @param {object} options - this is mainly relevant for plugins (will always be empty in the config), default to an empty object
+	 **/
+	webpack(config, env, helpers, options) {
+		/** you can change the config here **/
+	},
+};
 ```
 
-See [WebpackConfigHelpers] docs for more info on ```helpers``` argument which contains methods to find various parts of configuration. Additionally see our [recipes wiki] containing examples on how to change webpack configuration.
+See [WebpackConfigHelpers] docs for more info on `helpers` argument which contains methods to find various parts of configuration. Additionally see our [recipes wiki] containing examples on how to change webpack configuration.
 
 #### Prerender multiple routes
 
 The `--prerender` flag will prerender by default only the root of your application.
 If you want to prerender other routes you can create a `prerender-urls.json` file, which contains the set of routes you want to render.
 The format required for defining your routes is an array of objects with a `url` key and an optional `title` key.
 
-```js
-// prerender-urls.json
-[{
-  "url": "/",
-  "title": "Homepage"
-}, {
-  "url": "/route/random"
-}]
+> `prerender-urls.json`
+
+```json
+[
+	{
+		"url": "/",
+		"title": "Homepage"
+	},
+	{
+		"url": "/route/random"
+	}
+]
 ```
 
-You can customise the path of `prerender-urls.json` by using the flag `--prerenderUrls`.
+You can customise the path and/or name of `prerender-urls.json` by using the flag `--prerenderUrls`.
 
 ```sh
 preact build --prerenderUrls src/prerender-urls.json
 ```
 
+If a static JSON file is too restrictive, you may want to provide a javascript file that exports your routes instead.
+Routes can be exported as a JSON string or an object and can optionally be returned from a function.
+
+```js
+// prerender-urls.js
+module.exports = [
+	{
+		url: '/',
+		title: 'Homepage',
+	},
+	{
+		url: '/route/random',
+	},
+];
+```
+
 #### Template
 
 A template is used to render your page.
@@ -253,10 +290,10 @@ preact build --template src/template.html
 preact watch --template src/template.html
 ```
 
-[Promise]: https://npm.im/promise-polyfill
+[promise]: https://npm.im/promise-polyfill
 [fetch]: https://github.com/developit/unfetch
 [preact]: https://github.com/developit/preact
-[WebpackConfigHelpers]: docs/webpack-helpers.md
+[webpackconfighelpers]: docs/webpack-helpers.md
 [`.babelrc`]: https://babeljs.io/docs/usage/babelrc
 [simple]: https://github.com/preactjs-templates/simple
 [`"browserslist"`]: https://github.com/ai/browserslist
@@ -266,14 +303,14 @@ preact watch --template src/template.html
 [preact-router]: https://github.com/developit/preact-router
 [material]: https://github.com/preactjs-templates/material
 [widget]: https://github.com/preactjs-templates/widget
-[Plugins wiki]: https://github.com/developit/preact-cli/wiki/Plugins
+[plugins wiki]: https://github.com/developit/preact-cli/wiki/Plugins
 [preactjs-templates organization]: https://github.com/preactjs-templates
 [preactjs-templates/default]: https://github.com/preactjs-templates/default
 [recipes wiki]: https://github.com/developit/preact-cli/wiki/Config-Recipes
-[PRPL]: https://developers.google.com/web/fundamentals/performance/prpl-pattern
+[prpl]: https://developers.google.com/web/fundamentals/performance/prpl-pattern
 [`babel-preset-env`]: https://github.com/babel/babel-preset-env#targetsbrowsers
 [proof]: https://googlechrome.github.io/lighthouse/viewer/?gist=142af6838482417af741d966e7804346
-[Preact CLI preset]: https://github.com/developit/preact-cli/blob/master/src/lib/babel-config.js
-[Service Workers]: https://developers.google.com/web/fundamentals/getting-started/primers/service-workers
-[Customize Babel]: https://github.com/developit/preact-cli/wiki/Config-Recipes#customising-babel-options-using-loader-helpers
+[preact cli preset]: https://github.com/developit/preact-cli/blob/master/src/lib/babel-config.js
+[service workers]: https://developers.google.com/web/fundamentals/getting-started/primers/service-workers
+[customize babel]: https://github.com/developit/preact-cli/wiki/Config-Recipes#customising-babel-options-using-loader-helpers
 [`async!`]: https://github.com/developit/preact-cli/blob/222e7018dd360e40f7db622191aeca62d6ef0c9a/examples/full/src/components/app.js#L7
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,7 +6,6 @@

		Did you add tests for your changes?


		Summary

		<!-- Explain the motivation for making this change. What existing problem does the pull request solve? -->
Expand Down