Vue 开发 Mendix 组件

请确保已经安装完一下命令:

npm node webpack zip cp 命令

1. 安装 mendix-cli 

npm install mendix-cli -g

2. 创建widget项目

mendix create widgetName

3. 执行命令

cd widgetName && npm install

 4.修改webpack.config.js

scripts: ['node package.xml.js && cd build && zip -r '+widget+'.mpk * && cp '+widget+'.mpk 构建成功后cp的目录名称'],

5.执行命令:

npm run build

之后会出现build目录 会出现.mpk widget文件

如果选择iview构建模板,会出现其他不同情况问题,需要添加一些loadder

"dependencies": {
    "iview": "3.3.3",
    "view-design": "^4.5.0",
    "vue": "^2.6.8"
  },
  "devDependencies": {
    "prop-types": "^15.7.2",
    "@babel/core": "^7.3.4",
    "@babel/plugin-proposal-object-rest-spread": "^7.4.3",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-transform-runtime": "^7.4.3",
    "@babel/preset-env": "^7.3.4",
    "babel": "^6.23.0",
    "babel-loader": "^8.0.5",
    "babel-plugin-import": "^1.11.0",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-vue-jsx": "^3.7.0",
    "babel-polyfill": "^6.26.0",
    "babel-register": "^6.26.0",
    "babel-runtime": "^6.26.0",
    "webpack": "^4.29.6",
    "webpack-shell-plugin-next": "^0.6.4",
    "iview-loader": "^1.2.2",
    "file-loader": "^3.0.1",
    "copy-webpack-plugin": "^4.5.1",
    "css-loader": "^2.1.0",
    "html-loader": "^0.5.5",
    "node-sass": "^4.11.0",
    "sass-loader": "^7.1.0",
    "url-loader": "^1.1.2",
    "style-loader": "^0.23.1",
    "vue-loader": "^15.7.0",
    "vue-template-compiler": "^2.6.8",
    "webpack-cli": "^3.2.3"
  },