Install Node.js on your computer. Download Link: http://nodejs.cn/download/. Recommend using the latest stable version.
Only do this step at the first time.
Run the following commands in terminal:
git clone https://github.com/WeBankFinTech/Scriptis.git
cd wds-ide
npm install
Commands explanation:
-
Pull remote repository to local:
git clone https://github.com/WeBankFinTech/Scriptis.git
-
Change to the root directory of the project:
cd wds-ide
-
Install all dependencies required for the project:
npm install
Only do this step at the first time.
You need to make some configurations in your code, such as port address of backend server and socket address of backend server in .env.development file in root directory.
// Port address of backend server
VUE_APP_MN_CONFIG_PREFIX=http://yourIp:yourPort/yourPath
// Socket address
VUE_APP_MN_CONFIG_SOCKET=/yourSocketPath
You can refer to the official documentation of vue-cli for detailed explanation. Modes and environment variables
You can run the following command in terminal to build the project:
npm run build
A folder named "dist" would appear in your project's root directory if the command has run successfully and you can directly put "dist" to your static server.
You would need to run the following command in terminal if you want to run project on your local browser and see corresponding effects after making changes to the code.
npm run serve
Access the application in browser (Chrome recommended) via link: http://localhost:8080/ .
Changes you make to the code would dynamically reflect on the effects shown on browser when using the method described above to run project.
Notes: Since frontend and backend are developed separately, when running on local browser you need to allow cross domain access in order to access the port of backend server.
e.g. Chrome browser:
Configuration in Windows:
-
Close all browser windows.
-
Create a shortcut of chrome, right-click to choose "properties" , then go to "Shortcut" tab find "Target" and add
--args --disable-web-security --user-data-dir=C:\MyChromeDevUserData
to it . -
Use shortcut to open the browser.
Configuration in MacOS:
Run the following command. (You need to replace "yourname" in the path. If it's not working, check the path of MyChromeDevUserData on your machine and copy its path to the place right after "--user-data-dir=")
open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/yourname/MyChromeDevUserData/
Try to use Taobao npm mirror:
npm install -g cnpm --registry=https://registry.npm.taobao.org
Next, run the following command instead of npm install:
cnpm install
Note that you can still use npm run serve
and npm run build
to run and build project.