Skip to content

Add commonjs, es6, umd build supports #327

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 9 commits into from
Jun 6, 2018
Merged

Add commonjs, es6, umd build supports #327

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
79d2c25
update .babelrc -> .babelrc.js
wuweiweiwu Jun 1, 2018
04e42f1
possibly use rollup?
wuweiweiwu Jun 1, 2018
0698a9b
dependencies
wuweiweiwu Jun 1, 2018
27f05ab
update tests: undefined is now removed from snapshots
wuweiweiwu Jun 1, 2018
f429e2b
setting NODE_ENV on test:watch
wuweiweiwu Jun 1, 2018
1217c31
updating README
wuweiweiwu Jun 1, 2018
44bd0bd
rollup build WOOOO
wuweiweiwu Jun 6, 2018
1173310
updated hot module reloading
wuweiweiwu Jun 6, 2018
4edf51c
make readme better
wuweiweiwu Jun 6, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 0 additions & 4 deletions .babelrc
View file
Open in desktop

This file was deleted.

44 changes: 44 additions & 0 deletions .babelrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
const env = process.env.NODE_ENV;

if (env === 'commonjs' || env === 'es') {
module.exports = {
ignore: ['*.test.js', 'src/tests.js'],
plugins: ['transform-runtime'],
presets: [['env', { modules: false }], 'react', 'stage-2'],
};

if (env === 'commonjs') {
module.exports.plugins.push('transform-es2015-modules-commonjs');
}
}

if (env === 'rollup') {
module.exports = {
comments: false,
plugins: ['external-helpers'],
presets: [['env', { modules: false }], 'react', 'stage-2'],
};
}

if (env === 'development') {
module.exports = {
presets: ['react', 'stage-2'],
plugins: ['react-hot-loader/babel'],
};
}

if (env === 'production') {
module.exports = {
comments: false,
plugins: ['transform-runtime'],
presets: ['env', 'react', 'stage-2'],
};
}

if (env === 'test') {
module.exports = {
comments: false,
plugins: ['transform-es2015-modules-commonjs'],
presets: ['react', 'stage-2'],
};
}
133 changes: 87 additions & 46 deletions README.md
View file
Open in desktop

Large diffs are not rendered by default.

3 changes: 2 additions & 1 deletion examples/basic-example/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React, { Component } from 'react';
import { hot } from 'react-hot-loader'; // eslint-disable-line import/no-extraneous-dependencies
import {
SortableTreeWithoutDndContext as SortableTree,
toggleExpandedForAll,
Expand Down Expand Up @@ -351,4 +352,4 @@ class App extends Component {
}
}

export default App;
export default hot(module)(App);
20 changes: 4 additions & 16 deletions examples/basic-example/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,11 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { AppContainer } from 'react-hot-loader'; // eslint-disable-line import/no-extraneous-dependencies
import { DragDropContext as dragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import App from './app';

const rootEl = document.getElementById('app');
const render = Component => {
const wrap = dragDropContext(HTML5Backend);
const Wrapped = wrap(Component);
ReactDOM.render(
<AppContainer>
<Wrapped />
</AppContainer>,
rootEl
);
};
const wrap = dragDropContext(HTML5Backend);
const Wrapped = wrap(App);

/* eslint-disable global-require, import/newline-after-import */
render(require('./app').default);
if (module.hot)
module.hot.accept('./app', () => render(require('./app').default));
/* eslint-enable global-require, import/newline-after-import */
ReactDOM.render(<Wrapped />, rootEl);
34 changes: 5 additions & 29 deletions examples/storybooks/__snapshots__/storyshots.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ exports[`Storyshots Advanced Drag from external source 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -276,7 +275,6 @@ exports[`Storyshots Advanced Drag out to remove 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -747,7 +745,6 @@ exports[`Storyshots Advanced Playing with generateNodeProps 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -1075,7 +1072,6 @@ exports[`Storyshots Advanced Touch support (Experimental) 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -1338,7 +1334,6 @@ exports[`Storyshots Advanced Tree-to-tree dragging 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -1552,7 +1547,6 @@ exports[`Storyshots Advanced Tree-to-tree dragging 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -1812,7 +1806,6 @@ exports[`Storyshots Basics Add and remove nodes programmatically 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -2087,7 +2080,6 @@ exports[`Storyshots Basics Callbacks 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -2416,7 +2408,6 @@ exports[`Storyshots Basics Minimal implementation 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -2675,7 +2666,6 @@ exports[`Storyshots Basics Modify nodes 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -3028,7 +3018,6 @@ exports[`Storyshots Basics Prevent drop 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -3660,7 +3649,6 @@ exports[`Storyshots Basics Search 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -3833,7 +3821,6 @@ exports[`Storyshots Basics Themes 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down Expand Up @@ -3931,9 +3918,7 @@ exports[`Storyshots Basics Themes 1`] = `
<div
className="rstcustom__rowLabel"
>
<span
className={undefined}
>
<span>
The file explorer theme
</span>
</div>
Expand Down Expand Up @@ -4019,9 +4004,7 @@ exports[`Storyshots Basics Themes 1`] = `
<div
className="rstcustom__rowLabel"
>
<span
className={undefined}
>
<span>
Imported from react-sortable-tree-theme-file-explorer
</span>
</div>
Expand Down Expand Up @@ -4104,9 +4087,7 @@ exports[`Storyshots Basics Themes 1`] = `
<div
className="rstcustom__rowLabel"
>
<span
className={undefined}
>
<span>
<div>
Find it on

Expand Down Expand Up @@ -4181,9 +4162,7 @@ exports[`Storyshots Basics Themes 1`] = `
<div
className="rstcustom__rowLabel"
>
<span
className={undefined}
>
<span>
More compact than the default
</span>
</div>
Expand Down Expand Up @@ -4250,9 +4229,7 @@ exports[`Storyshots Basics Themes 1`] = `
<div
className="rstcustom__rowLabel"
>
<span
className={undefined}
>
<span>
<div>
Simply set it to the
<code>
Expand Down Expand Up @@ -4329,7 +4306,6 @@ exports[`Storyshots Basics treeData import/export 1`] = `
aria-label="grid"
aria-readonly={true}
className="ReactVirtualized__Grid ReactVirtualized__List rst__virtualScrollOverride"
id={undefined}
onScroll={[Function]}
role="grid"
style={
Expand Down
73 changes: 47 additions & 26 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,26 +3,38 @@
"version": "2.1.2",
"description": "Drag-and-drop sortable component for nested data and hierarchies",
"scripts": {
"build": "npm run clean && cross-env NODE_ENV=production TARGET=umd webpack --bail",
"build:demo": "npm run clean:demo && cross-env NODE_ENV=production TARGET=demo webpack --bail && npm run build-storybook",
"clean": "rimraf dist style.css style.css.map",
"prebuild": "npm run lint",
"build": "npm run build:commonjs && npm run build:es && npm run build:umd && npm run build:demo",
"build:umd": "npm run clean:umd && cross-env NODE_ENV=rollup rollup -c",
"build:es": "npm run clean:es && cross-env NODE_ENV=es babel src --out-dir dist/es",
"build:commonjs": "npm run clean:commonjs && cross-env NODE_ENV=commonjs babel src --out-dir dist/commonjs",
"build:demo": "npm run clean:demo && cross-env NODE_ENV=production webpack --bail && npm run build-storybook",
"clean:demo": "rimraf build",
"start": "cross-env NODE_ENV=development TARGET=development webpack-dev-server --inline --hot",
"clean:commonjs": "rimraf dist/commonjs",
"clean:es": "rimraf dist/es",
"clean:umd": "rimraf dist/umd",
"start": "cross-env NODE_ENV=development webpack-dev-server --hot",
"lint": "eslint src examples",
"prettier": "prettier --single-quote --trailing-comma es5 --write \"{src,examples}/**/*.{js,css,md}\"",
"prepublishOnly": "npm run lint && npm run test && npm run build",
"release": "standard-version",
"test": "jest",
"test:watch": "jest --watchAll",
"test": "cross-env NODE_ENV=test jest",
"test:watch": "cross-env NODE_ENV=test jest --watchAll",
"deploy": "npm run build:demo && gh-pages -d build",
"storybook": "cross-env TARGET=development start-storybook -p ${PORT:-3001} -h 0.0.0.0",
"build-storybook": "cross-env NODE_ENV=production build-storybook -o build/storybook"
"storybook": "start-storybook -p ${PORT:-3001} -h 0.0.0.0",
"build-storybook": "build-storybook -o build/storybook"
},
"main": "dist/commonjs/index.js",
"module": "dist/es/index.js",
"jsnext:main": "dist/es/index.js",
"babel": {
"presets": [
"./.babelrc.js"
]
},
"main": "dist/main.js",
"files": [
"dist",
"style.css",
"style.css.map"
"style.css"
],
"repository": {
"type": "git",
Expand Down Expand Up @@ -60,8 +72,8 @@
"dependencies": {
"lodash.isequal": "^4.5.0",
"prop-types": "^15.6.1",
"react-dnd": "2.6.0",
"react-dnd-html5-backend": "2.6.0",
"react-dnd": "3.0.2",
"react-dnd-html5-backend": "3.0.2",
"react-dnd-scrollzone": "^4.0.0",
"react-lifecycles-compat": "^3.0.4",
"react-virtualized": "^9.19.1"
Expand All @@ -74,16 +86,20 @@
"@storybook/addon-options": "^4.0.0-alpha.4",
"@storybook/addon-storyshots": "^4.0.0-alpha.4",
"@storybook/react": "^4.0.0-alpha.4",
"autoprefixer": "^8.5.0",
"autoprefixer": "^8.5.2",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-eslint": "^8.2.3",
"babel-jest": "^22.4.4",
"babel-jest": "^23.0.1",
"babel-loader": "^7.1.4",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"codesandbox": "^1.2.10",
"coveralls": "^3.0.1",
"cross-env": "^5.1.6",
Expand All @@ -100,25 +116,30 @@
"file-loader": "^1.1.11",
"gh-pages": "^1.1.0",
"html-webpack-plugin": "^3.2.0",
"jest": "^22.4.4",
"jest-enzyme": "^6.0.0",
"jest": "^23.1.0",
"jest-enzyme": "^6.0.1",
"json-loader": "^0.5.7",
"postcss-loader": "^2.1.5",
"prettier": "^1.12.1",
"react": "^16.2.0",
"prettier": "^1.13.3",
"react": "^16.4.0",
"react-addons-shallow-compare": "^15.6.2",
"react-dnd-test-backend": "2.6.0",
"react-dnd-test-backend": "3.0.2",
"react-dnd-touch-backend": "0.4.0",
"react-dom": "^16.2.0",
"react-hot-loader": "^4.2.0",
"react-dom": "^16.4.0",
"react-hot-loader": "^4.3.0",
"react-sortable-tree-theme-file-explorer": "^1.1.2",
"react-test-renderer": "^16.3.2",
"react-test-renderer": "^16.4.0",
"rimraf": "^2.6.2",
"rollup": "^0.59.4",
"rollup-plugin-babel": "^3.0.4",
"rollup-plugin-commonjs": "^9.1.3",
"rollup-plugin-node-resolve": "^3.3.0",
"rollup-plugin-postcss": "^1.6.2",
"rollup-plugin-uglify": "^4.0.0",
"standard-version": "^4.4.0",
"style-loader": "^0.21.0",
"uglifyjs-webpack-plugin": "^1.2.5",
"webpack": "^4.8.3",
"webpack-cli": "^2.1.3",
"webpack": "^4.10.2",
"webpack-cli": "^2.1.4",
"webpack-dev-server": "^3.1.4",
"webpack-node-externals": "^1.7.2"
},
Expand Down
Loading