search

tangrams / tangram

WebGL map rendering engine for creative cartography
https://tangram.city
MIT License
2.22k stars 290 forks source link

Problems building Tangram with Windows PowerShell #594

Closed scriptingmax closed 7 years ago

scriptingmax commented 7 years ago

I have been using "tangram.debug.js" in my project, but there were some functions I cannot debug.

I have tried to reference the moudle.js, but got "Uncaught SyntaxError: Unexpected token import" in my browser. I think it might because the browser cannot recognize ES6 . image

So, how can I reference the source code ( js in src ) in my project？

bcamper commented 7 years ago

To build and load Tangram locally, please follow the build instructions: https://github.com/tangrams/tangram/blob/master/CONTRIBUTING.md#building

This should allow you to browse or debug all internal Tangram files.

scriptingmax commented 7 years ago

Thanks. But I got error when NPM RUN BUILD @bcamper (NODE 6.11.3/ NPM 5.4.2/ win10/ x64, haven't meet this error when I build other project) Sorry to bother again, error goes like:

tangram@0.13.2 build E:\tangram-master npm run build-bundle && npm run build-minify

npm WARN invalid config loglevel="notice"

tangram@0.13.2 build-bundle E:\tangram-master $(npm bin)/browserify src/module.js -t [ babelify --presets [ es2015 ] ] -t brfs --debug -s Tangram -p browserify-derequire -p [ './build/quine.js' 'tangram.debug.js.map' ] -p [ mapstraction 'dist/tangram.debug.js.map' ] -o dist/tangram.debug.js

'$' is not recognized as an internal or external command, operable program or batch file. npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! tangram@0.13.2 build-bundle: $(npm bin)/browserify src/module.js -t [ babelify --presets [ es2015 ] ] -t brfs --debug -s Tangram -p browserify-derequire -p [ './build/quine.js' 'tangram.debug.js.map' ] -p [ mapstraction 'dist/tangram.debug.js.map' ] -o dist/tangram.debug.js npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the tangram@0.13.2 build-bundle script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! tangram@0.13.2 build: npm run build-bundle && npm run build-minify npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the tangram@0.13.2 build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

(Same error occurred in NPM START)

tangram@0.13.2 build-bundle E:\tangram-master $(npm bin)/browserify src/module.js -t [ babelify --presets [ es2015 ] ] -t brfs --debug -s Tangram -p browserify-derequire -p [ './build/quine.js' 'tangram.debug.js.map' ] -p [ mapstraction 'dist/tangram.debug.js.map' ] -o dist/tangram.debug.js

'$' is not recognized as an internal or external command, operable program or batch file. ... ...

bcamper commented 7 years ago

Hi - are you on Windows? Looks like it may be this error #569? cc @meetar

meetar commented 7 years ago

Copying and pasting that command on its own looks successful – it completes for me with no errors. And running the whole command still works for me as referenced in #569.

scriptingmax commented 7 years ago

Yep，win10.@bcamper

bcamper commented 7 years ago

@scriptingmax could you please try the command directly as @meetar suggests?

scriptingmax commented 7 years ago

It doesn't work after I used the "$(npm bin)/...." command, was I misunderstand? @meetar

meetar commented 7 years ago

Can you show us the whole command you tried?

I was talking about this one, as mentioned in #569:

$(npm bin)/budo src/module.js:dist/tangram.debug.js --port 8000 --cors --live -- -t [ babelify --presets [ es2015 ] ] -t brfs -s Tangram -p [ './build/quine.js' 'tangram.debug.temp.js.map' ] -p [ mapstraction 'dist/tangram.debug.temp.js.map' ]

scriptingmax commented 7 years ago

I did tried the whole command, but it didn't recognize. @meetar image

meetar commented 7 years ago

Looks like budo wasn't installed correctly, can you send us the output of the command npm install budo?

(Budo should have been included with npm install – you already did that, right?)

scriptingmax commented 7 years ago

I have install budo and other moudles by cnpm (a complete npm image provide by Alibaba 淘宝), because the connect with npm doesn't goes well in china. image image

It should be fine with the install.

scriptingmax commented 7 years ago

@meetar @bcamper The “$(npm bin)/budo.....” problem occurred in all my group‘s computers(windows 10/ x64), and sorry we are not familiar with unix.

We've been doing fine by using npm to dev and build our js projects ( vue.js mostly ).

Thought that might because the tangram's npm scripts doesn't work well in windows 10.

Thanks for your patiently answer, but I'm still confused...

bcamper commented 7 years ago

Does the command 'npm run build' work for you? It doesn't require budo.

On Wed, Sep 20, 2017 at 9:45 PM Max notifications@github.com wrote:

@meetar https://github.com/meetar @bcamper https://github.com/bcamper The “$(npm bin)/budo.....” problem occurred in all my group‘s computers(windows 10/ x64), and sorry we are not familiar with unix.

We've been doing fine by using npm to dev and build our js projects ( vue.js mostly ).

Thought that might because the tangram's npm scripts doesn't work well in windows 10.

Thanks for your patiently answer, but I'm still confused...

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/tangrams/tangram/issues/594#issuecomment-331027328, or mute the thread https://github.com/notifications/unsubscribe-auth/AABBXap53ShIXZFKtnkJy75xQT2loRPyks5skb-ngaJpZM4PYh3H .

scriptingmax commented 7 years ago

@bcamper

no....NPM RUN BUILD turns out like this:

tangram@0.13.2 build-bundle E:\tangram-master $(npm bin)/browserify src/module.js -t [ babelify --presets [ es2015 ] ] -t brfs --debug -s Tangram -p browserify-derequire -p [ './build/quine.js' 'tangram.debug.js.map' ] -p [ mapstraction 'dist/tangram.debug.js.map' ] -o dist/tangram.debug.js '$' is not recognized as an internal or external command, operable program or batch file.

Copying and pasting that command got same error as NPM START

The error seems be unrelated with budo or browserify, it's the windows powershell failed to recognize the syntax.

meetar commented 7 years ago

Ah! I should have asked what shell you were using. The npm scripts assume that you are using a bash shell.

Windows Powershell has a number of differences which prevent normal unix-type script evaluation. For instance, it uses backslashes in its paths instead of forward slashes.

Also, it doesn't do inline variable expansion except when the expression is enclosed by double quotes, like so: "$(npm bin)\budo" – additionally, by default it doesn't load commands from the current location using a relative path, and instead requires that every executable be referenced using an absolute path.

So just this one command in the script file: $(npm bin)/budo must be converted to Powershell style to function: ."$(npm bin)\budo"

For building Tangram (as well as most other packages in npm) on Windows, I recommend using a bash shell like git bash, available in Git for Windows. Although it has its own problems when spawning subprocesses (#569) it can at least run the commands when they are pasted directly into the prompt.