make failed by codemirror.ts

[habuka036]

Hello.

I got following error when trying to compile ketchup.

$ make
make -C admin
make[1]: Entering directory '/home/osamu/go/src/github.com/ketchuphq/ketchup/admin'
gulp
[16:23:41] Using gulpfile ~/go/src/github.com/ketchuphq/ketchup/admin/gulpfile.js
[16:23:41] Starting 'css:clean'...
[16:23:41] Starting 'css:internal'...
[16:23:41] Starting 'css:sass'...
[16:23:41] Starting 'js:clean'...
[16:23:41] Starting 'js:internal'...
[16:23:41] Starting 'js:lint'...
[16:23:42] Starting 'js:webpack'...
[16:23:42] Starting 'html'...
[16:23:42] Starting 'images'...
[16:23:42] Finished 'css:clean' after 1.06 s
[16:23:42] Finished 'js:clean' after 1.05 s
[16:23:43] Finished 'js:internal' after 2.07 s
[16:23:43] Finished 'html' after 1.06 s
[16:23:43] Finished 'css:sass' after 2.08 s
[16:23:43] Finished 'images' after 1.17 s
ts-loader: Using typescript@2.6.2 and /home/osamu/go/src/github.com/ketchuphq/ketchup/admin/tsconfig.json
[16:23:46] Finished 'css:internal' after 5.54 s
[16:23:46] Starting 'css'...
[16:23:46] Finished 'css' after 62 μs
ERROR: (no-console) /home/osamu/go/src/github.com/ketchuphq/ketchup/admin/src/js/components/content.tsx[77, 3]: Calls to 'console.log' are not allowed.

[16:23:54] [webpack]
Hash: 935bebfaf04bce392a82
Version: webpack 3.10.0
Time: 12428ms
        Asset    Size  Chunks                    Chunk Names
         0.js  796 kB       0  [emitted]  [big]  hljs
         1.js  441 kB       1  [emitted]  [big]  codemirror
         2.js  489 kB       2  [emitted]  [big]  quill
       app.js  171 kB       3  [emitted]         app
    vendor.js  199 kB       4  [emitted]         vendor
     0.js.map  949 kB       0  [emitted]         hljs
     1.js.map  540 kB       1  [emitted]         codemirror
     2.js.map  589 kB       2  [emitted]         quill
   app.js.map  186 kB       3  [emitted]         app
vendor.js.map  216 kB       4  [emitted]         vendor
   [2] external "m" 42 bytes {3} [not cacheable]
  [23] ./node_modules/store/dist/store.modern.js 296 bytes {4} [built]
  [81] multi store/dist/store.modern date-fns/format lodash-es/debounce lodash-es/cloneDeep lodash-es/isEqual 76 bytes {4} [built]
 [178] ./src/js/app.ts 1.34 kB {3} [built]
 [179] ./src/js/components/layout.tsx 792 bytes {3} [built]
 [181] ./src/js/pages/home.tsx 1.37 kB {3} [built]
 [182] ./src/js/pages/pages.tsx 3.19 kB {3} [built]
 [184] ./src/js/pages/page.tsx 9.62 kB {3} [built]
 [192] ./src/js/pages/login.ts 2.66 kB {3} [built]
 [193] ./src/js/pages/theme.tsx 6.71 kB {3} [built]
 [194] ./src/js/pages/themes.tsx 1.79 kB {3} [built]
 [195] ./src/js/pages/template.tsx 3.02 kB {3} [built]
 [196] ./src/js/pages/settings.tsx 3.18 kB {3} [built]
 [199] ./src/js/pages/data.tsx 2.55 kB {3} [built]
 [201] ./src/js/pages/install-theme.tsx 3.26 kB {3} [built]
    + 374 hidden modules

ERROR in /home/osamu/go/src/github.com/ketchuphq/ketchup/admin/src/js/types/codemirror.ts
(5,21): error TS2307: Cannot find module 'CodeMirror'.
[16:23:54] Finished 'js:webpack' after 12 s
[16:23:55] Finished 'js:lint' after 14 s
[16:23:55] Starting 'js'...
[16:23:55] Finished 'js' after 5.27 μs
[16:23:55] Starting 'bindata'...
/bin/sh: 1: go-bindata: not found
[16:23:55] 'bindata' errored after 49 ms
[16:23:55] Error in plugin "gulp-shell"
Message:
    Command `go-bindata -pkg admin -prefix build build build/vendor build/js build/css build/images` failed with exit code 127
/bin/sh: 1: go-bindata: not found
/bin/sh: 1: go-bindata: not found
/bin/sh: 1: go-bindata: not found
/bin/sh: 1: go-bindata: not found
Makefile:6: recipe for target 'sources' failed
make[1]: *** [sources] Error 1
make[1]: Leaving directory '/home/osamu/go/src/github.com/ketchuphq/ketchup/admin'
Makefile:8: recipe for target 'dev' failed
make: *** [dev] Error 2

My environment is:

• Linux Mint 18
• go 1.8.3
• node 8.2.1

Could you please let me know what requirements for compiling ketchup.

Thanks.

[octavore]

I'm have trouble replicating the codemirror.ts error, but I did notice that you're running a newer version of Typescript (2.6.2) than is in the yarn.lock file (2.4.2), so perhaps you have a dependency that's incompatible? I would suggest trying the following: remove your existing admin/node_modules folder and use yarn to install the javascript deps.

I also see that the go-bindata binary can't be found, you should try adding $GOPATH/bin to your $PATH to fix that issue.

Hope that helps!

[habuka036]

Hi octavore, thank you for your response.

I tried to re-compile with your advice, but I was not able to compile as successfully in my environment. In next, I created another environment that following:

• CentOS Linux 7.3.1611
• go 1.9.3
• node 9.4.0
• typescript 2.7.1

I modified admin/src/js/types/codemirror.ts because I'll resolve error message "error TS2307: Cannot find module 'CodeMirror'"

--- ./admin/src/js/types/codemirror.ts.orig 2018-02-06 00:35:39.333021581 +0000
+++ ./admin/src/js/types/codemirror.ts  2018-02-05 06:29:07.876746213 +0000
@@ -2,7 +2,7 @@
 // http://www.jbrantly.com/es6-modules-with-typescript-and-webpack/
 // https://stackoverflow.com/questions/38168733/typescript-export-all-functions-in-a-namespace
 // reexport codemirror type from namespace
-import * as CM from 'CodeMirror';
+import * as CM from 'codemirror';
 declare global {
   var CodeMirror: typeof CM;
 }

and, I modified Makefile because I occur error "go-bindata: not found" in this environment too after I add "$GOPATH/bin" to $PATH.

--- ./admin/gulp/bindata.js.orig    2018-02-06 00:52:40.055557630 +0000
+++ ./admin/gulp/bindata.js 2018-02-05 03:56:06.709228156 +0000
@@ -11,7 +11,7 @@
 let bindata = () =>
   gulp.src('build/*', { read: false })
     .pipe(shell([
-      `go-bindata -pkg admin -prefix build ${buildPaths.join(' ')}`
+      `~/go/bin/go-bindata -pkg admin -prefix build ${buildPaths.join(' ')}`
     ], {
         env: {
           PATH: `${process.env.GOPATH}/bin`

Then I successfully compiled, but unfortunately, ketchup not rendering correctly in compose page as following:

By the way, are you planning to release next version ketchup as corresponding to bindext? If you have planned next release, could you please tell me you when to release that?

Thank you.

[octavore]

Thanks, I think I've figured out the codemirror error (I have a case-insensitive filesystem, so the incorrectly cased import worked on my computer). For the rendering problem, could you try this branch and let me know if it solves the issue? I've tweaked the Quill import to use dynamic imports, maybe that will help.

[habuka036]

Thank you. I compiled it branch, I appear successful.

Thank you again.