weex-toolkit is an official command line tool to help developers to create, debug and build their Weex project.
use npm to install weex-toolkit:
if you make it, you can input “weex” in your command line terminal to test it. The right output:
if you have never installed node.js, you should go node.js.org to download and install it.
- node engine version >= 6. You can try n to manage your node versions*
If you meet some errors when installing like
permission error, please go weex-toolkit issues to find some solution or have a discuss with us.
After command running, you can find
awesome-project directory and there are some Weex templates in it.
There are some useful npm scripts you will use in the future:
build: build the source code and generate the JS bundle
dev: run webpack watch configuration
serve: start a web server
debug: open the debug mode
When all dependences are ready, you can input
npm run dev and run
npm run server in a command line tab. Now you can visit our web page in :
weex-toolkit supports previewing your Weex file(
.vue) in a watch mode. You only need specify your file path.
The browser will auto open the location and you could see the layout and effects of your Weex page. If you have a Playground app in your mobile devices, you can scan the QR code at the opened page.
Try the command below, you’ll preview the whole directory files.
You need to specify the directory path and the entry file(
weex compile to build your single weex file or the whole project.
There are two arguments. One is your code source path (a single file or a directory) and another is your destination path you want to build
weex-toolkit has the ability to extend third party script. And Weex devtools is a custom devtools for Weex that implements Chrome Debugging Protocol, it is designed to help you quickly inspect your app and debug your JS bundle source in a Chrome web page, both android and iOS platform are supported. So you can use weex-devtools feature by weex-toolkit.
this command will start debug server and launch a chrome opening
this page will display a qrcode ,you can use
Playground App scan it for starting debug.
this command will compile
your_weex.js and start the debug server as upon command.
your_weex.js will deploy on the server and displayed in
DeviceList page as another qrcode contain the url of your_weex.js.
this command will build every file in
your/we/pathand deploy them on the bundle server. your directory will mapping to http://localhost:port/weex/
-e to set the entry of these bundles. and the url of
index.we will display on device list page as another qrcode.
Inspector can be used to show your
Console log \
Native View and so on.
- See the doc Weex devtools (Android), it will lead you to config and use it step by step.
- See the doc Weex devtools (IOS), it will lead you to config and use it step by step.
weexpack helps to setup Weex application from scratch quickly. With simple commands, developers could create a Weex project, add different platform template, could install plugins from local, GitHub or Weex market, could pack up his application project and run on mobile. For those who would like to share his own plugins, he could publish them to the Weex market.
Now weex-toolkit can run the same commands of
weexpack because of the new architecture. If your directory is generated by
weexpack, you can build your iOS or android app.
platform add|remove to add or remove Weex app template and run it in your target devices.
If you use these commands firstly, you might see the prompt. Just enter Y.
Then run platform, you will see an iPhone simulator.
If you want to use some plugins on the weex market, weex-toolkit is the right choice.
You need to specify the plugin name from market like “weex-chart”:
Remove some plugins(eg: weex-chart):
Learn more about weexpack .