!> If you don't have node.js installed locally, you can go to Nodejs official website to download and install, and make sure your node version is >=7.6.0
, you can use n to perform version management of node.
If you have problems during the installation process, you can do a question search and feedback at here.
$ npm install weex-toolkit -g
# Create a project from the official template $ weex create my-project
The @weex-cli/generator
module uses download-git-repo
to download the template file. The download-git-repo
tool allows You specify a specific branch and remote repository address for project download, and the specified branch is separated by the (#
) symbol.
The template format under the download specific branch is as follows:
$ weex create '<template-name>#<branch-name>' <project-name>
E.g:
$ weex create weex-templates/webpack#v1.0 my-project
This command will initialize the project via the v1.0
branch of the weex-templates/webpack project.
You can create project templates from official templates or remote sources, or you can create your own weex
project templates. For more details you can see [How to create your own templates](https://github.com/weex-templates /How-to-create-your-own-template).
The @weex-cli/compile
module provides the ability to compile .vue
files in Weex projects. You can use them in official projects, or you can directly compile sandboxes with zero configuration for a single .vue
file, use as follows:
$ weex compile [resource file] [product address] <options>
E.g:
$ weex compile src build
or
$ weex compile src/index.vue build
Options | Description |
---|---|
-w, --watch | Listen for file changes and compile in real time [Default: true ] |
-d,--devtool [devtool] | Set the devtool option for webpack compilation |
-e,--ext [ext] | Set the default build file [Default: .vue ] |
-m, --min | Code obfuscation and compression of the product [Default: false ] |
-c, --config | Incoming webpack configuration file [Default: false ] |
-b, --base | Set the base path [Default: process.cwd() ] |
The @weex-cli/preview
module provides the ability to compile and preview .vue
files in Weex projects. You can use them in official projects, or you can directly perform a sandbox preview of zero configuration for a single .vue
file, use as follows:
$ weex preview [file | folder] <options>
The browser will automatically open the preview page and you can see the layout and effects of your weex page. If you have Weex Playground App installed on your device, you can also view the page by scanning the QR code on the page.
Using the command below, you will be able to preview the .vue
file in the entire folder.
$ weex src --entry src/foo.vue
You need to specify the folder path to be previewed and the entry file (passed in --entry
).
Options | Description |
---|---|
-d,--devtool [devtool] | Set the devtool option for webpack compilation |
-m, --min | Code obfuscation and compression of the product [Default: false ] |
-c, --config | Incoming webpack configuration file [Default: false ] |
-b, --base | Set the base path [Default: process.cwd() ] |
The @weex-cli/generator
module provides the ability to add Weex official iOS/Android engineering features.
Use the weex platform [add|remove] [ios|android]
command to add or remove the iOS/Android
project template.
$ weex platform add ios
$ weex platform remove ios
This command is only valid in the official weex
project. Please note the project structure. You can use weex platform list
to view the supported platforms in your project.
The @weex-cli/run
module provides the ability to add and run Weex official iOS/Android project functions, which you can use with the following commands:
# Run iOS Simulator Preview $ weex run ios # Run Android Simulator / Real Machine Preview $ weex run android # Run web preview $ weex run web
The @weex-cli/debug
module provides debugging capabilities for Weex pages, which can be started with the following command:
$ weex debug [we_file|bundles_dir] [options]
Options | Description |
---|---|
-p, --port [port] | Set the port of the debug server, [default: 8088 ] |
--manual | When this option is enabled, the browser will not open automatically, [Default: false ] |
--channelid | Specify debug channel ID |
--remote-debug-port [port] | Set the debug server port number, [default: 9222 ] |
Reference documentation:
The @weex-cli/lint
module provides a Weex code quality check function that can be started with the following command:
$ weex lint [file | folder] <options>
@weex-cli/lint
The built-in eslint
module is used for code quality verification. For options, please refer to ESLint CLI.
If you want to add the weex
code quality check to your project, you can also add the eslint plugin eslint-plugin-weex Way to use.
The @weex-cli/doctor
module provides a check for the local development environment and can be started with the following command:
$ weex doctor
This command will check your local development environment, you can adjust your development environment according to the prompts, in order to develop the weex page.