From 76d637471f37a6da6cc430bf4d9d92ed4daa1b8f Mon Sep 17 00:00:00 2001 From: Aaron Ballard Date: Fri, 16 Jun 2017 17:12:21 -0500 Subject: [PATCH 1/2] Added a rollup config section to the readme. Probably needs to be trimmed down, included everything needed to run the example below the configs --- README.md | 37 +++++++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) diff --git a/README.md b/README.md index bd9ca00..9e314e1 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,43 @@ First, install it: `npm install --save-dev aliasify` } ``` +## Usage with Rollup + +Using `preact-compat` with rollup requires [rollup-plugin-alias](http://npm.im/rollup-plugin-alias), along with a few other plugins + +First, install it: `npm install --save-dev rollup-plugin-alias rollup-plugin-buble rollup-plugin-commonjs rollup-plugin-node-resolve rollup-plugin-replace` + +... then in your `rollup.config.js`, configure the alias plugin to point to `react` and `react-dom`, along with the rest of the plugins: + +```js +import alias from "rollup-plugin-alias"; +import buble from "rollup-plugin-buble"; +import resolve from "rollup-plugin-node-resolve"; +import replace from "rollup-plugin-replace"; +import commonjs from "rollup-plugin-commonjs"; +// ... + +export default { + // ... + plugins: [ + // ... + resolve({ + jsnext: true // preact + }), + alias({ + "react": "node_modules/preact-compat/dist/preact-compat.es.js", + "react-dom": "node_modules/preact-compat/dist/preact-compat.es.js", + "create-react-class": "node_modules/preact-compat/lib/create-react-class.js" + }), + commonjs(), // prop-types + replace({ + "process.env.NODE_ENV": JSON.stringify("development") // prop-types + }), + buble() // es6 + // ... +} +``` + ## Usage with Babel Using `preact-compat` with Babel is easy. From af7f21a77667ebc5730ca0d76a987ca04ac455e5 Mon Sep 17 00:00:00 2001 From: Aaron Ballard Date: Thu, 14 Sep 2017 22:20:27 -0500 Subject: [PATCH 2/2] Update rollup section of documentation - Removed all plugins except alias - added path.resolve to aliases --- README.md | 25 +++++++------------------ 1 file changed, 7 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index 9e314e1..439ed97 100644 --- a/README.md +++ b/README.md @@ -96,37 +96,26 @@ First, install it: `npm install --save-dev aliasify` ## Usage with Rollup -Using `preact-compat` with rollup requires [rollup-plugin-alias](http://npm.im/rollup-plugin-alias), along with a few other plugins +Using `preact-compat` with rollup requires [rollup-plugin-alias](http://npm.im/rollup-plugin-alias) -First, install it: `npm install --save-dev rollup-plugin-alias rollup-plugin-buble rollup-plugin-commonjs rollup-plugin-node-resolve rollup-plugin-replace` +First, install it: `npm install --save-dev rollup-plugin-alias` -... then in your `rollup.config.js`, configure the alias plugin to point to `react` and `react-dom`, along with the rest of the plugins: +... then in your `rollup.config.js`, configure the alias plugin to point to `react`, `react-dom`, and optionally `create-react-class`, along with the rest of the plugins: ```js +import path from "path"; import alias from "rollup-plugin-alias"; -import buble from "rollup-plugin-buble"; -import resolve from "rollup-plugin-node-resolve"; -import replace from "rollup-plugin-replace"; -import commonjs from "rollup-plugin-commonjs"; // ... export default { // ... plugins: [ // ... - resolve({ - jsnext: true // preact - }), alias({ - "react": "node_modules/preact-compat/dist/preact-compat.es.js", - "react-dom": "node_modules/preact-compat/dist/preact-compat.es.js", - "create-react-class": "node_modules/preact-compat/lib/create-react-class.js" - }), - commonjs(), // prop-types - replace({ - "process.env.NODE_ENV": JSON.stringify("development") // prop-types + "react": path.resolve(__dirname, "node_modules", "preact-compat", "dist", "preact-compat.es.js"), + "react-dom": path.resolve(__dirname, "node_modules", "preact-compat", "dist", "preact-compat.es.js"), + "create-react-class": path.resolve(__dirname, "node_modules", "preact-compat", "lib", "create-react-class.js") }), - buble() // es6 // ... } ```