Build, Minify, Merge TypeScript by webassets¶
webassets is a media manager written in Python to merge JS, compress JS/CSS, uglifying, and so on. and It also provide the way to coraborate with a veriety of WebFrameworks.
- Building TypeScript
pip install webassets pip install PyYAML
now you might get webassets==0.9, PyYAML==3.11.
pip install jsmin
Python requiremests are them. And ofcause TypeScript is necessary to bulid them.
npm install -g typescript
now you’d better to check ‘tsc’ command.
OK. let’s make it.
Configuation for building¶
Now let’s write the configuration file. You can put ‘webassets.yml’ file you want. In this post, I won’t show you how to write it step by step. But I’ll show you a case and it’s sample file, and then, describe each meanings of it.
directory: ./karmaid/static debug: False bundles: js-karmaid: contents: - js/lib/jquery-2.1.0.js - js/lib/knockout-3.1.0.js - js/lib/underscore-1.6.0.js - contents: - js/app/config.d.ts - js/lib/jquery.d.ts - js/lib/knockout.d.ts - js/lib/underscore.d.ts - js/app/api.ts - js/app/ko_flushvalue.ts - js/karmaid.ts filters: typescript filters: jsmin output: js/karmaid.js
it means the root directory http://webassets.readthedocs.org/en/latest/environment.html#webassets.env.Environment.directory
you can switch it by own enviroments http://webassets.readthedocs.org/en/latest/environment.html#webassets.env.Environment.debug
Specify to minify, build, uglify and so on.
You can learn about all of filters provided by webassets http://webassets.readthedocs.org/en/latest/builtin_filters.html
After making the config. Run the command to build:
webassets -c webassets.yml build
If you want to generate one JS, run it:
webassets -c webassets.yml build <bundle name>
Because I wanted to try it. You know, you can choice fanstatic or grunt too.
And I want to use it with Pyramid and Python3, but now, pyramid_webassets on PyPI isn’t support Python3. This supporting will be finished soon (https://github.com/sontek/pyramid_webassets/issues/23).