[Pkg-javascript-devel] trying to build libjs-vue

[Pirate Praveen]

On 2017, നവംബർ 29 3:39:51 PM IST, Paolo Greppi <paolo.greppi at libpf.com> wrote:
>Hi all, I an trying to build from vue.js sources, see:
>ITP: https://bugs.debian.org/871459
>repo: https://anonscm.debian.org/git/pkg-javascript/vue.js.git
>
>More precisely what is wanted is the browser (UMD) build, see:
>https://vuejs.org/v2/guide/installation.html#Explanation-of-Different-Builds
>
>To rebuild dist from source, upstream uses rollup (which is currently
>stuck in contrib) plus a few rollup plugins we lack:
>- rollup-plugin-buble
>- rollup-plugin-alias
>- rollup-plugin-node-resolve
>
>Therefore I attempted a hacky build avoiding rollup completely, and
>using a combination of babeljs + browserify-lite.
>
>First I patched .babelrc as follows (apparently jsx can be used by vue
>apps, but is not required for building vue itself):
>-  "plugins": ["transform-vue-jsx", "syntax-dynamic-import"],
>+  "plugins": ["syntax-dynamic-import"],
>
>then:
>apt install node-browserify-lite node-babel-cli
>node-babel-preset-es2015 node-babel-plugin-syntax-dynamic-import
>node-babel-preset-flow-vue
>babeljs src -d dist1
>NODE_PATH=dist1 browserify-lite --standalone Vue ./dist1/core/index.js
>--outfile dist/vue.js
>uglifyjs -o dist/vue.min.js --source-map=dist/vue.min.js.map
>dist/vue.js
>
>The resulting binaries are smaller/different than upstream
>(https://github.com/vuejs/vue/tree/d4e0c3ef2444384719638a89f2a25af042b95795/dist):
>
>ls -l dist
>...
>-rw-r--r-- 1 root root 165464 Nov 29 10:19 vue.js
>-rw-r--r-- 1 root root 111528 Nov 29 10:19 vue.min.js
>-rw-r--r-- 1 root root 106896 Nov 29 10:19 vue.min.js.map
>
>ls -l ../vue.js-2.5.9/dist
>...
>-rw-r--r-- 1 paolog paolog 286869 nov 27 22:54 vue.common.js
>-rw-r--r-- 1 paolog paolog 278610 nov 27 22:54 vue.esm.browser.js
>-rw-r--r-- 1 paolog paolog 286852 nov 27 22:54 vue.esm.js
>-rw-r--r-- 1 paolog paolog 284067 nov 27 22:54 vue.js
>-rw-r--r-- 1 paolog paolog  86676 nov 27 22:54 vue.min.js
>-rw-r--r-- 1 paolog paolog 208010 nov 27 22:54 vue.runtime.common.js
>-rw-r--r-- 1 paolog paolog 207993 nov 27 22:54 vue.runtime.esm.js
>-rw-r--r-- 1 paolog paolog 205957 nov 27 22:54 vue.runtime.js
>-rw-r--r-- 1 paolog paolog  61382 nov 27 22:54 vue.runtime.min.js
>
>Testing them in a real-world application which works fine with upstream
>dist files gives errors in the browser console:
>
>vue.js:1450 Uncaught ReferenceError: process is not defined
>    at Object.10.shared/util (vue.js:1450)
>    at req (vue.js:6)
>    at modRequire (vue.js:11)
>    at Object.4.../config (vue.js:273)
>    at req (vue.js:6)
>    at modRequire (vue.js:11)
>    at Object.1../init (vue.js:54)
>    at req (vue.js:6)
>    at modRequire (vue.js:11)
>    at Object.0../instance/index (vue.js:21)
>
>feeds.php:123 Uncaught ReferenceError: Vue is not defined
>    at feeds.php:123
>
>...
>
>Has anybody here more clues than I have ?

Because browserify-lite will not handle nodejs api conversion. You can use webpack (though one of its dependencies is still stuck in NEW and blocked by 
https://bugs.debian.org/cgi-bin/bugreport.cgi?bug=881339 it would be great if more people can add their comments there).

You can enable contrib to get node-acorn-dynamic-import required for webpack.

>Paolo

-- 
Sent from my Android device with K-9 Mail. Please excuse my brevity.