Making commonjs default and umd the secondary

This commit is contained in:
Michael Walker 2018-11-21 15:17:23 -08:00
Родитель 3af76108cb
Коммит 99f06f985f
6 изменённых файлов: 814 добавлений и 34 удалений

1
.gitignore поставляемый
Просмотреть файл

@ -13,3 +13,4 @@ cypress/videos/
## Files ## Files
result.xml result.xml
npm-debug.log npm-debug.log
dist/index.html

Просмотреть файл

@ -49,7 +49,15 @@ If you are creating an open source application under a license compatible with t
## Usage ## Usage
This wrapper creates a ```<ReactFullpage />``` component. It exposes a render-prop API so markup can remain the same across fullpage.js libraries. The render prop accepts 1 parameter in its callback which contains the component's react properties state, context, etc. This wrapper creates a `<ReactFullpage />` component. It exposes a render-prop API so markup can remain the same across fullpage.js libraries. The render prop accepts 1 parameter in its callback which contains the component's react properties state, context, etc.
## UMD
A umd bundle is available for those without a build step
```js
import ReactFullpage from '@fullpage/react-fullpage-umd'; // will return static version on server and "live" version on client
```
## Server Side Rendering ## Server Side Rendering
@ -79,7 +87,9 @@ const Fullpage = () => (
<ReactFullpage.Wrapper> <ReactFullpage.Wrapper>
<div className="section"> <div className="section">
<p>Section 1 (welcome to fullpage.js)</p> <p>Section 1 (welcome to fullpage.js)</p>
<button onClick={() => fullpageApi.moveSectionDown()}>Click me to move down</button> <button onClick={() => fullpageApi.moveSectionDown()}>
Click me to move down
</button>
</div> </div>
<div className="section"> <div className="section">
<p>Section 2</p> <p>Section 2</p>
@ -98,7 +108,7 @@ Fullpage.js Extension Example:
```jsx ```jsx
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import 'fullpage.js/vendors/scrolloverflow' // Optional. When using the fullPage.js option scrollOverflow:true import 'fullpage.js/vendors/scrolloverflow'; // Optional. When using the fullPage.js option scrollOverflow:true
// Optional. When using add-on fullpage extensions // Optional. When using add-on fullpage extensions
//import './fullpage.scrollHorizontally.min' //import './fullpage.scrollHorizontally.min'
@ -112,7 +122,9 @@ const Fullpage = () => (
<ReactFullpage.Wrapper> <ReactFullpage.Wrapper>
<div className="section"> <div className="section">
<p>Section 1 (welcome to fullpage.js)</p> <p>Section 1 (welcome to fullpage.js)</p>
<button onClick={() => fullpageApi.moveSectionDown()}>Click me to move down</button> <button onClick={() => fullpageApi.moveSectionDown()}>
Click me to move down
</button>
</div> </div>
<div className="section"> <div className="section">
<p>Section 2</p> <p>Section 2</p>
@ -134,7 +146,7 @@ The wrapper maintains state in accordance to the latest version of fullpage.js [
The most recent callback event that triggered a state change will be available as `state.lastEvent` The most recent callback event that triggered a state change will be available as `state.lastEvent`
*NOTE: if the v2 prop is passed, state will be mapped to v2 [callbacks](https://github.com/alvarotrigo/fullPage.js/tree/v.2.9.7#callbacks)* _NOTE: if the v2 prop is passed, state will be mapped to v2 [callbacks](https://github.com/alvarotrigo/fullPage.js/tree/v.2.9.7#callbacks)_
## Props ## Props
@ -146,8 +158,6 @@ Props object can contain standard [options](https://github.com/alvarotrigo/fullP
More on callbacks [here](https://github.com/alvarotrigo/react-fullpage#callbacks) More on callbacks [here](https://github.com/alvarotrigo/react-fullpage#callbacks)
*NOTE: jquery must be passed as a prop ($) if using the v2 API*
## Methods ## Methods
fullPage.js contains many [methods](https://github.com/alvarotrigo/fullPage.js#methods). fullPage.js contains many [methods](https://github.com/alvarotrigo/fullPage.js#methods).

11
dist/index.html поставляемый
Просмотреть файл

@ -1,11 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>@fullpage/react-fullpage</title>
</head>
<body>
<div id="react-root"></div>
<script type="text/javascript" src="react-fullpage.js"></script></body>
</html>

782
dist/react-fullpage-umd.js поставляемый Normal file

Различия файлов скрыты, потому что одна или несколько строк слишком длинны

22
dist/react-fullpage.js поставляемый
Просмотреть файл

@ -5,17 +5,8 @@
* *
* Copyright (C) 2018 alvarotrigo.com - A project by Alvaro Trigo & Michael Walker * Copyright (C) 2018 alvarotrigo.com - A project by Alvaro Trigo & Michael Walker
*/ */
(function webpackUniversalModuleDefinition(root, factory) { module.exports =
if(typeof exports === 'object' && typeof module === 'object') /******/ (function(modules) { // webpackBootstrap
module.exports = factory(require("React"));
else if(typeof define === 'function' && define.amd)
define("ReactFullpage", ["React"], factory);
else if(typeof exports === 'object')
exports["ReactFullpage"] = factory(require("React"));
else
root["ReactFullpage"] = factory(root["React"]);
})(window, function(__WEBPACK_EXTERNAL_MODULE__0__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache /******/ // The module cache
/******/ var installedModules = {}; /******/ var installedModules = {};
/******/ /******/
@ -105,7 +96,7 @@ return /******/ (function(modules) { // webpackBootstrap
/* 0 */ /* 0 */
/***/ (function(module, exports) { /***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE__0__; module.exports = require("React");
/***/ }), /***/ }),
/* 1 */ /* 1 */
@ -135,8 +126,8 @@ var external_React_default = /*#__PURE__*/__webpack_require__.n(external_React_)
// CONCATENATED MODULE: ./components/Wrapper/index.js // CONCATENATED MODULE: ./components/Wrapper/index.js
/* eslint-disable import/no-extraneous-dependencies */var Wrapper_Wrapper=function Wrapper(_ref){var children=_ref.children;return external_React_default.a.createElement(external_React_["Fragment"],null,children);};/* harmony default export */ var components_Wrapper = (Wrapper_Wrapper); /* eslint-disable import/no-extraneous-dependencies */var Wrapper_Wrapper=function Wrapper(_ref){var children=_ref.children;return external_React_default.a.createElement(external_React_["Fragment"],null,children);};/* harmony default export */ var components_Wrapper = (Wrapper_Wrapper);
// CONCATENATED MODULE: ./components/index.js // CONCATENATED MODULE: ./components/index.js
/* eslint-disable *//* harmony default export */ var components = __webpack_exports__["default"] = ((function(){var exported=void 0;if(typeof foobarbaz!=="undefined"){exported=__webpack_require__(9).default;}else{// NOTE: SSR support /* eslint-disable *//* harmony default export */ var components = __webpack_exports__["default"] = ((function(){var exported=void 0;if(typeof window!=='undefined'){exported=__webpack_require__(9).default;}else{// NOTE: SSR support
exported=__webpack_require__(3).default;}exported.Wrapper=components_Wrapper;console.log("exported = ",exported);return exported;})()); exported=__webpack_require__(3).default;}exported.Wrapper=components_Wrapper;return exported;})());
/***/ }), /***/ }),
/* 3 */ /* 3 */
@ -778,5 +769,4 @@ case'afterLoad':state=makeState(fromArgs(['origin','destination','direction']));
case'onLeave':state=makeState(fromArgs(['origin','destination','direction']));break;case'onSlideLeave':state=makeState(fromArgs(['section','origin','slideIndex','destination','direction']));break;default:break;}this.setState(state,function(){var _props;(_props=_this3.props)[lastEvent].apply(_props,args);});}},{key:'render',value:function render(){return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement('div',{id:'fullpage'},this.props.render(this));}}]);return ReactFullpage;}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);/* harmony default export */ __webpack_exports__["default"] = (ReactFullpage); case'onLeave':state=makeState(fromArgs(['origin','destination','direction']));break;case'onSlideLeave':state=makeState(fromArgs(['section','origin','slideIndex','destination','direction']));break;default:break;}this.setState(state,function(){var _props;(_props=_this3.props)[lastEvent].apply(_props,args);});}},{key:'render',value:function render(){return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement('div',{id:'fullpage'},this.props.render(this));}}]);return ReactFullpage;}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);/* harmony default export */ __webpack_exports__["default"] = (ReactFullpage);
/***/ }) /***/ })
/******/ ]); /******/ ]);
});

Просмотреть файл

@ -30,6 +30,14 @@ module.exports = [
path: path.join(__dirname, 'dist'), path: path.join(__dirname, 'dist'),
filename: 'react-fullpage.js', filename: 'react-fullpage.js',
library: 'ReactFullpage', library: 'ReactFullpage',
libraryTarget: 'commonjs2',
},
}),
merge(webpackConfig, shared, {
output: {
path: path.join(__dirname, 'dist'),
filename: 'react-fullpage-umd.js',
library: 'ReactFullpage',
libraryTarget: 'umd', libraryTarget: 'umd',
umdNamedDefine: true, umdNamedDefine: true,
}, },