chore: use parcel for packaging ReSpec #1493

nileshgulia1 · 2018-02-09T20:08:24Z

@saschanaz @marcoscaceres .I have closed old PR for some rebasing and conflicting issues.This patch bundles required js files which are dependencies in basic.html including w3c common.js to builds directory.

saschanaz · 2018-02-10T00:17:16Z

(The result should be respec-w3c-common.js rather than basic.js)

nileshgulia1 · 2018-02-10T13:05:12Z

package.json

@@ -71,7 +71,7 @@
    "test:karma": "npm run karma",
    "prepare": "npm run snyk-protect",
    "prepublish": "npm run snyk-protect",
-    "parcel": "parcel ./examples/basic.html -d ./builds"
+    "parcel": "parcel  ./builds/respec-w3c-common.js -d ./builds/output"


@saschanaz Done!

nileshgulia1 · 2018-02-11T13:52:33Z

@marcoscaceres Can we have it merged now?

marcoscaceres · 2018-02-11T15:48:06Z

I’m still unsure what this does? I’m sure it does something useful, but can you help me understand what advantages it brings to the project.

nileshgulia1 · 2018-02-11T17:24:54Z

@marcoscaceres Parcel bundles w3.respec.common.js and its linked dependencies to build folder. I thought that parcel-bundler is very good ,but it doesn't support multiple entry points which is needed here, I have used it because of its easy setup, no config file etc. It also enables uglify.js within itself to minify the code so we can refrain from using some packages here.

marcoscaceres · 2018-02-12T00:10:21Z

@saschanaz, what’s your opinion? Worth using?

saschanaz · 2018-02-12T00:18:43Z

tools/builder.js

@@ -77,16 +76,6 @@ See original source for licenses: https://github.com/w3c/respec */
 window.respecVersion = "${version}";


npm run parcel currently skips adding boilerplate, we should add it.

(Note that this is also broken in master. (Comments disappear!))

npm run parcel currently skips adding boilerplate, we should add it.

Which boilerplate?

This part:

https://github.com/w3c/respec/blob/1aa589d19fa99e05768cb95bebc156854727c221/tools/builder.js#L71-L76

saschanaz · 2018-02-12T00:20:45Z

I haven't really tried this PR yet, but I'm not sure why the test failures we've seen on #1489 do not occur here (as parcel also uses uglify-es).

saschanaz · 2018-02-12T00:47:36Z

And can you push your package-lock.json changes, as it helps seeing dependency changes + boosts installation speed?

marcoscaceres · 2018-02-12T04:29:57Z

@nileshgulia1, you probably want to give this a rebase before adding your package-lock.

saschanaz · 2018-02-12T11:26:46Z

yarn is good, but I'm not sure we should maintain both lock files...

saschanaz · 2018-02-12T11:47:50Z

.travis.yml

@@ -6,7 +6,6 @@ node_js:
 install:
  - npm install
  - npm run build
-  - npm run build:respec-w3c-common


We should add npm run parcel here, but npm run parcel never ends on my local environment. Not sure what's happening.

saschanaz · 2018-02-12T11:53:46Z

package.json

@@ -71,7 +70,8 @@
    "test:headless": "node ./tests/headless.js",
    "test:karma": "npm run karma",
    "prepare": "npm run snyk-protect",
-    "prepublish": "npm run snyk-protect"
+    "prepublish": "npm run snyk-protect",
+    "parcel": "parcel  ./builds/respec-w3c-common.js -d ./builds/output"


build is omitted: "parcel build ./builds/respec-w3c-common.js -d ./builds/output"

I Have tried adding build before but is repeatedly throws this error:

parcel build ./builds/respec-w3c-common.js -d ./builds/output 🚨 /home/nilesh/respec/builds/respec-w3c-common.js: sym.definition is not a function at may_modify (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:8931:31) at TreeTransformer.abort [as before] (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:8541:74) at AST_VarDef.eval [as transform] (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:4570:35) at eval (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:4586:25) at doit (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:130:23) at MAP (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:156:52) at do_list (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:4585:16) at eval (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:4664:28) at AST_Const.eval [as transform] (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:4573:17) at collapse (eval at <anonymous> (/home/nilesh/respec/node_modules/uglify-es/tools/node.js:21:1), <anonymous>:8617:39)

Ah yes, this is the uglify-es problem we met in #1489 that will be fixed in its next release. See mishoo/UglifyJS#2896

Let's do not use it until new release ,Using --no-minify removes this error for me. parcel-bundler/parcel#8. What do you think @saschanaz @marcoscaceres ?

We ultimately want to minify this, otherwise the bundle size will be huge... so we are kinda stuck until the next Uglify release.

--no-minify may still be good for debugging purpose, where source mapping is frequently not perfect.

saschanaz · 2018-02-12T11:58:55Z

I'm getting error logs when building:

> npm run parcel

> respec@19.2.0 parcel C:\Users\sasch\Documents\GitHub\respec
> parcel build ./builds/respec-w3c-common.js -d ./builds/output

∞  Building respec-w3c-common.js...
Condition always false [0:2608,20]
Condition left of && always false [0:2617,87]
Dropping unreachable code [0:2867,384]
Declarations in unreachable code! [0:2867,384]
Dropping unreachable code [0:3099,151]
Declarations in unreachable code! [0:3099,151]
Function.protoype.arguments not supported [0:4182,628]
Function.protoype.arguments not supported [0:4188,164]
Dropping duplicated definition of variable ADa [0:4435,14]
Function.protoype.arguments not supported [0:4616,49]
Function.protoype.arguments not supported [0:4616,67]
Function.protoype.arguments not supported [0:4630,120]
Function.protoype.arguments not supported [0:4707,361]
Function.protoype.arguments not supported [0:4798,41]
Function.protoype.arguments not supported [0:4798,73]
Function.protoype.arguments not supported [0:4830,24]
Dropping duplicated definition of variable dLa [0:4840,25]
Function.protoype.arguments not supported [0:4930,22]
Non-strict equality against boolean: == false [0:5302,6]
Non-strict equality against boolean: == false [0:5302,63]
Dropping unreachable code [0:5652,184]
√  Built in 16.58s.

Too hard to understand as it never says what file is in problem.

Also, we should be able to get a non-minified version of file:

Ok, but it would be a hard requirement that we can generate a concatenated, but not minified, version for development... otherwise, debugging is going to be extremely hard. Sourcemaps are very very broken across browsers, so definitely don't want to be reliant on them (been there, done that, never again 🤪).

nileshgulia1 · 2018-02-12T13:14:21Z

.travis.yml

@@ -6,6 +6,7 @@ node_js:
 install:
  - npm install
  - npm run build
+  - npm run parcel


Adding npm run parcel is causing travis to fail.

@saschanaz Should I remove this ?

No, this is the required step. I think npm run build should be completely replaced by npm run parcel, as that's the whole purpose of using parcel.

saschanaz · 2018-02-14T01:22:44Z

Currently we are generating transpiled non-concatenated files into js/ and examples/basic.html uses them. parcel removes the need of them, and then we probably should remove basic.html as we already have basic.built.html.

Additionally, we can remove direct babel dependency as all those things should be processed by parcel.

(BTW, I'm still worrying about recent uglify-es breakage though... Using parcel will lock the dependency, we cannot consider babel-minify then.)

marcoscaceres · 2018-02-14T02:49:42Z

Currently we are generating transpiled non-concatenated files into js/ and examples/basic.html uses them. parcel removes the need of them, and then we probably should remove basic.html as we already have basic.built.html.

I'm still super concerned about trying to work with sourcemaps and a fully bundled app (debugging experience is still really terrible), so I'd prefer to keep basic.html... at least, till I'm confident that source mapping support is sane.

marcoscaceres · 2018-02-14T02:51:45Z

(I'm willing to try tho - super interested to see what comes out of all this)

saschanaz · 2018-02-14T02:53:12Z

I'm still super concerned about trying to work with sourcemaps and a fully bundled app (debugging experience is still really terrible)

Deeply agreed, but that means we should't use parcel at all, we are just adding a new dependency then.

marcoscaceres · 2018-02-14T03:00:33Z

Deeply agreed, but that means we should't use parcel at all, we are just adding a new dependency then.

Yeah, I'm kinda getting the same feeling - and can definitely live with the current setup. I guess eventually (in around 2 years) we will just be able to use ES Modules and native require() to import things we need. That seems fine to me.

saschanaz · 2018-02-14T03:09:52Z

For a reference: this 2015 webpack issue webpack/webpack#1194 is still open 😞

marcoscaceres · 2018-02-14T04:16:28Z

Lol, it was filed by an old friend on mine! Hi @Stuk!

marcoscaceres · 2018-02-14T04:21:37Z

ok, I think we should close this.

@nileshgulia1, I want to say thanks for doing this investigation. This has been extremely helpful as it helped us understand the problem better. So, even though we aren't merging, we've learned a lot.

Stuk · 2018-02-15T06:49:06Z

Haha, hi @marcoscaceres 👋

nileshgulia1 commented Feb 10, 2018

View reviewed changes

saschanaz requested changes Feb 12, 2018

View reviewed changes

marcoscaceres changed the title ~~Bundled some files~~ chore: use parcel for packaging ReSpec Feb 12, 2018

nileshgulia1 added 5 commits February 12, 2018 15:31

added parcel-bundler and built w3c commmon respec to builds

28b1c9c

remove script

5cb9493

removed build script

523018f

changed entry to respec-w3c-common

c252f51

yarn lock

1aa589d

nileshgulia1 force-pushed the bundle branch from 0aab92a to 1aa589d Compare February 12, 2018 10:03

saschanaz requested changes Feb 12, 2018

View reviewed changes

added parcel script to travis

b0fe846

nileshgulia1 commented Feb 12, 2018

View reviewed changes

marcoscaceres closed this Feb 14, 2018

nileshgulia1 deleted the bundle branch February 14, 2018 05:28

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore: use parcel for packaging ReSpec #1493

chore: use parcel for packaging ReSpec #1493

nileshgulia1 commented Feb 9, 2018 •

edited by marcoscaceres

Loading

saschanaz commented Feb 10, 2018

nileshgulia1 Feb 10, 2018

nileshgulia1 commented Feb 11, 2018

marcoscaceres commented Feb 11, 2018

nileshgulia1 commented Feb 11, 2018

marcoscaceres commented Feb 12, 2018

saschanaz Feb 12, 2018

saschanaz Feb 12, 2018 •

edited

Loading

nileshgulia1 Feb 12, 2018

saschanaz Feb 12, 2018

saschanaz commented Feb 12, 2018 •

edited

Loading

saschanaz commented Feb 12, 2018

marcoscaceres commented Feb 12, 2018

saschanaz commented Feb 12, 2018

saschanaz Feb 12, 2018

saschanaz Feb 12, 2018

nileshgulia1 Feb 12, 2018

saschanaz Feb 12, 2018

nileshgulia1 Feb 12, 2018

marcoscaceres Feb 13, 2018

saschanaz Feb 14, 2018

saschanaz commented Feb 12, 2018

nileshgulia1 Feb 12, 2018

nileshgulia1 Feb 13, 2018

saschanaz Feb 14, 2018

saschanaz commented Feb 14, 2018 •

edited

Loading

marcoscaceres commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

saschanaz commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

saschanaz commented Feb 14, 2018 •

edited

Loading

marcoscaceres commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

Stuk commented Feb 15, 2018

		@@ -77,16 +76,6 @@ See original source for licenses: https://github.com/w3c/respec */
		window.respecVersion = "${version}";

chore: use parcel for packaging ReSpec #1493

chore: use parcel for packaging ReSpec #1493

Conversation

nileshgulia1 commented Feb 9, 2018 • edited by marcoscaceres Loading

saschanaz commented Feb 10, 2018

Choose a reason for hiding this comment

nileshgulia1 commented Feb 11, 2018

marcoscaceres commented Feb 11, 2018

nileshgulia1 commented Feb 11, 2018

marcoscaceres commented Feb 12, 2018

Choose a reason for hiding this comment

saschanaz Feb 12, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

saschanaz commented Feb 12, 2018 • edited Loading

saschanaz commented Feb 12, 2018

marcoscaceres commented Feb 12, 2018

saschanaz commented Feb 12, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

saschanaz commented Feb 12, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

saschanaz commented Feb 14, 2018 • edited Loading

marcoscaceres commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

saschanaz commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

saschanaz commented Feb 14, 2018 • edited Loading

marcoscaceres commented Feb 14, 2018

marcoscaceres commented Feb 14, 2018

Stuk commented Feb 15, 2018

nileshgulia1 commented Feb 9, 2018 •

edited by marcoscaceres

Loading

saschanaz Feb 12, 2018 •

edited

Loading

saschanaz commented Feb 12, 2018 •

edited

Loading

saschanaz commented Feb 14, 2018 •

edited

Loading

saschanaz commented Feb 14, 2018 •

edited

Loading