###app模板工程介绍

####目录结构

> demo  
  > ├─config `构建脚本`  
  > ├─public  
  > ├─src  
  > │ ├─assets  
  > │ ├─utils  
  > │ ├─views  
  > ├─.eslintrc.js  
  > ├─.gitignore  
  > ├─.gitlab-ci.yml  
  > ├─.npmignore   
  > ├─app.config.json  `nr-os平台APP配置文件，收集APP所有信息`  
  > ├─babel.config.js  
  > ├─index.demo.js  `nr.os下模块打包入口`  
  > ├─package.json  
  > ├─README.md  
  > └─vue.config.js  

####创建APP工程
- dev.config.js 和 pro.config.js
```js
const path = require('path')
var config = {
    configureWebpack: {
        entry: {
          app: './index.demo.js',   //*****模块打包入口文件
        },
        devtool: 'source-map',     
        output: {
            filename: '[name].bundle.js',
            library: 'portal_application',
            libraryTarget: 'umd',
            libraryExport: 'default',
            umdNamedDefine: true,
            globalObject: 'this'
        },
        externals: {
          'vue': {
              root: 'Vue',
              commonjs: 'vue',
              commonjs2: 'vue',
              amd: 'vue'
          },
          jquery: 'jQuery',
          ['$']: 'jQuery',
          'vue-router': 'VueRouter',
          vuex: 'Vuex',
          iview: 'iview',
          iviewex: 'iviewex'
        },
        module: {
            rules: [
                {
                    test: /\.(mp4|flv|swf)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                    loader: "file-loader",
                    options: {
                      name: 'video/[name].[hash:7].[ext]'
                    }
                }
            ]
        },
        resolve: {
            alias: {  //*******全局定义的别名，只建议使用以下别名
                '@common': path.resolve(__dirname,'../../common'),
                '@components': path.resolve(__dirname,'../../components/src/views'),
                '@api': path.resolve(__dirname,'../../common/api'),
                '@utils': path.resolve(__dirname,'../../common/utils'),
                '@gcRoot': path.resolve(__dirname,'../../'),
            },
            extensions: ['.js', '.vue']
        },
    },
    css: { extract: false },
    lintOnSave: false,
    productionSourceMap: false,
}
module.exports = config

```

- app.config.json
```json5
{
  "name": "@gc/demo",
  "title": "测试App",
  "author": "admin",
  "keywords": "demo",
  "company": "久其软件",
  "type": false,
  "version": "v0.1",
  "license": "",
  "description": "",
  "icon":"icon-_ZSYshujuluru",
  "data": {
    "static": [         //**********app个性静态文件
      {"name": "vuex", "url": "static/lib/vuex.min.js"}
    ],
    "app": {
      "component": ["dist/app.bundle.js"] //**********不要修改
    },
    "config": [  //**********app入口参数
      {
        "title":"模版",
        "key":"code",
        "type": "array",
        "dataSource": {
          "api":"/api/define",
          "titleColumn":"title",
          "valueColumn": "code"
        }
      }
    ]
  }
}
```

####**注意事项**
- 模块命名规范 
- 模块互相引用，本模块的依赖应该包含被包含模块的依赖
- 定义了一些全局别名,每个模块强制使用。模块自己的别名建议不要设置，除非确定别人不会通过路径引用你的模块。
- 模块间的代码依赖方式，路径引用到组件的 index.js