Skip to content

replaces http-server with a live-reloading rollup dev server #39

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

Closed
telamonian wants to merge 2 commits into from
Closed

replaces http-server with a live-reloading rollup dev server #39

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8994c7f
adds a live-reloading dev server to the rollup watch build
telamonian Jun 8, 2020
122baea
add less srcs to rollup build/watch
telamonian Jun 8, 2020
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
8 changes: 7 additions & 1 deletion .travis.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,12 @@ install:
- yarn

script:
# lint first, no point running tests just to fail on lint
- yarn lint

# test production build
- yarn build
- yarn clean
Copy link
Copy Markdown
Member

@texodus texodus Jun 12, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Really not fortunate that this builds twice ..


# dev build will run as part of `yarn test`
- yarn test
- yarn lint
52 changes: 52 additions & 0 deletions examples/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
<!--

Copyright (c) 2020, the Regular Table Authors.

This file is part of the Regular Table library, distributed under the terms of
the Apache License 2.0. The full license can be found in the LICENSE file.

-->

<!--

Entry point for serving the examples from [`regular-table`](https://github.com/jpmorganchase/regular-table).

-->

<!DOCTYPE html>
<html>

<head>

<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

<style>
#list {
display: flex;
flex-direction: column;
}
</style>

</head>

<body>

<div id="list">
<a href="2d_array.html">2d_array.html</a>
<a href="benchmark.html">benchmark.html</a>
<a href="canvas_data_model.html">canvas_data_model.html</a>
<a href="file_browser.html">file_browser.html</a>
<a href="minesweeper.html">minesweeper.html</a>
<a href="perspective_headers.html">perspective_headers.html</a>
<a href="perspective.html">perspective.html</a>
<a href="react.html">react.html</a>
<a href="spreadsheet.html">spreadsheet.html</a>
<a href="two_billion_rows.html">two_billion_rows.html</a>
<a href="virtual_indices.html">virtual_indices.html</a>
<a href="web_worker.html">web_worker.html</a>
</div>

</body>

</html>
9 changes: 8 additions & 1 deletion jest-puppeteer.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,13 @@
module.exports = {
server: {
command: "yarn start -p 8081",
command: "yarn start --port 8081",
launchTimeout: 30000,
port: 8081,
waitOnScheme: {
resources: [
"dist/css/material.css",
"dist/umd/regular-table.js",
],
},
},
};
17 changes: 9 additions & 8 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,22 +16,21 @@
"unpkg": "dist/umd/regular-table.js",
"jsdelivr": "dist/umd/regular-table.js",
"files": [
"dist/**/*",
"less",
"dist/css/*.css",
"dist/umd/*",
"src/less/*.less",
"babel.config.js"
],
"scripts": {
"build:rollup": "rollup -c rollup.config.js",
"build:less": "lessc src/less/material.less dist/css/material.css",
"build": "npm-run-all -p build:*",
"clean": "rimraf dist",
"docs": "jsdoc2md src/js/index.js --separators --heading-depth 1 > api.md",
"lint": "eslint src examples/*.html",
"fix": "yarn lint --fix",
"lint": "eslint src examples/*.html",
"start": "rollup -c rollup.dev.config.js",
"test": "jest --noStackTrace",
"start": "http-server",
"watch:babel": "babel src/js --watch --out-dir dist/esm",
"watch:webpack": "rollup -c rollup.config.js --watch",
"watch:rollup": "rollup -c rollup.dev.config.js --watch",
"watch": "npm-run-all -p watch:*"
},
"publishConfig": {
Expand All @@ -55,7 +54,6 @@
"eslint": "^7.1.0",
"eslint-plugin-html": "^6.0.2",
"eslint-plugin-prettier": "^3.1.3",
"http-server": "^0.12.3",
"jest": "^26.0.1",
"jest-puppeteer": "^4.4.0",
"jsdoc-to-markdown": "^6.0.1",
Expand All @@ -67,6 +65,9 @@
"react-dom": "15",
"rollup": "^2.13.1",
"rollup-plugin-filesize": "^9.0.0",
"rollup-plugin-livereload": "^1.3.0",
"rollup-plugin-postcss": "^3.1.2",
"rollup-plugin-serve": "^1.0.1",
"rollup-plugin-sourcemaps": "^0.6.2",
"rollup-plugin-terser": "^6.1.0",
"source-map-explorer": "^2.4.2",
Expand Down
41 changes: 32 additions & 9 deletions rollup.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,47 @@
import {terser} from "rollup-plugin-terser";
import babel from "@rollup/plugin-babel";
import filesize from "rollup-plugin-filesize";
import postcss from "rollup-plugin-postcss"
import sourcemaps from "rollup-plugin-sourcemaps";
import babel from "@rollup/plugin-babel";
import {terser} from "rollup-plugin-terser";

export default {
export default [{
input: "src/less/material.less",
output: {
dir: "dist/css",
},
plugins: [
postcss({
inject: false,
extract: "material.css",
sourceMap: false,
minimize: true,
}),
Copy link
Copy Markdown
Member

@texodus texodus Jun 12, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

postcss is a good addition! It was not possible with the old babel-based build but is quite simple with rollup

],
watch: {
clearScreen: false,
},
},
{
input: "src/js/index.js",
output: {
sourcemap: true,
file: "dist/umd/regular-table.js",
},
plugins: [
babel({
exclude: "node_modules/**",
babelHelpers: "bundled",
}),
sourcemaps(),
filesize(),
postcss({
inject: false,
sourceMap: false,
minimize: true,
}),
sourcemaps(),
terser(),
],
watch: {
clearScreen: false,
},
output: {
sourcemap: true,
file: "dist/umd/regular-table.js",
},
};
}];
56 changes: 56 additions & 0 deletions rollup.dev.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import babel from "@rollup/plugin-babel";
import filesize from "rollup-plugin-filesize";
import livereload from "rollup-plugin-livereload"
import postcss from "rollup-plugin-postcss"
import serve from "rollup-plugin-serve"
import sourcemaps from "rollup-plugin-sourcemaps";

export default commandLineArgs => {
Copy link
Copy Markdown
Member

@texodus texodus Jun 12, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file is 99% identical to rollup.config.js - it would be really helpful to not duplicate this as the project grows. Since this version is only called with --watch - why not merge these and simply dispatch the minimize and plugins changes based on this flag as you do --port

const port = +commandLineArgs.port || 8080;
// ref: https://github.com/rollup/rollup/issues/2694#issuecomment-463915954
delete commandLineArgs.port;

return [{
input: "src/less/material.less",
output: {
dir: "dist/css",
},
plugins: [
postcss({
inject: false,
extract: "material.css",
sourceMap: true,
})
],
watch: {
clearScreen: false,
},
},
{
input: "src/js/index.js",
output: {
sourcemap: true,
file: "dist/umd/regular-table.js",
},
plugins: [
babel({
exclude: "node_modules/**",
babelHelpers: "bundled",
}),
filesize(),
livereload("dist"),
postcss({
inject: false,
sourceMap: true,
}),
serve({
contentBase: [".", "examples"],
port
}),
Copy link
Copy Markdown
Member

@texodus texodus Jun 12, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is no nice way to say this - rollup-plugin-server is unconditionally worse than http-server :(

sourcemaps(),
],
watch: {
clearScreen: false,
},
}];
};
5 changes: 3 additions & 2 deletions src/js/scroll_panel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,11 @@
*
*/

import {css, log_perf, html, throttlePromise} from "./utils";
import {log_perf, html, throttlePromise} from "./utils";
import {DEBUG, BROWSER_MAX_HEIGHT, DOUBLE_BUFFER_RECREATE, DOUBLE_BUFFER_ROW, DOUBLE_BUFFER_COLUMN} from "./constants";

import container_css from "../less/container.less";

Copy link
Copy Markdown
Member

@texodus texodus Jun 12, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is great to remove but it leaves the vestigial code - the babel plugin and symbol in utils.js

/**
* Handles the virtual scroll pane, as well as the double buffering
* of the underlying <table>. This DOM structure looks a little like
Expand Down Expand Up @@ -64,7 +66,6 @@ export class RegularVirtualTableViewModel extends HTMLElement {
create_shadow_dom() {
this.attachShadow({mode: "open"});
const slot = `<slot></slot>`;
const container_css = css`src/less/container.less`;
this.shadowRoot.innerHTML = html`
<style>
${container_css}
Expand Down
Loading