add dependencies

.browserslistrc

-> 1%
-last 2 versions
-not dead

.eslintrc.js

-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  'extends': [
-    'plugin:vue/essential',
-    'eslint:recommended',
-    '@vue/typescript/recommended'
-  ],
-  parserOptions: {
-    ecmaVersion: 2020
-  },
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
-  }
-}

package.json

 {
-  "name": "im-demo2",
+  "name": "im-demo3",
   "version": "0.1.0",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "vue-cli-service lint",
+    "init": "npm install --registry http://npm.job.qinqinxiaobao.com && npx browserslist@latest --update-db && npm run init-submodule",
+    "update-sdk": "npm install uniplat-sdk@latest --registry http://npm.job.qinqinxiaobao.com --save",
+    "init-submodule": "git submodule init && git submodule update && cd src/customer-service && git checkout master && git pull && npm install --registry http://npm.job.qinqinxiaobao.com"
   },
   "dependencies": {
     "core-js": "^3.8.3",
+    "element-ui": "^2.15.7",
+    "lodash": "^4.17.21",
+    "moment": "^2.29.1",
     "register-service-worker": "^1.7.2",
+    "uniplat-sdk": "^0.1.320-private",
     "vue": "^2.6.14",
     "vue-class-component": "^7.2.3",
     "vue-property-decorator": "^9.1.2",
     "vue-router": "^3.5.1",
-    "vuex": "^3.6.2"
+    "vuex": "^3.6.2",
+    "vuex-class": "^0.3.2"
   },
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^5.4.0",
@@ -26,12 +34,50 @@
     "@vue/cli-plugin-typescript": "~5.0.0",
     "@vue/cli-plugin-vuex": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "@vue/eslint-config-standard": "^6.1.0",
     "@vue/eslint-config-typescript": "^9.1.0",
+    "compression-webpack-plugin": "^9.2.0",
     "eslint": "^7.32.0",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^5.1.0",
     "eslint-plugin-vue": "^8.0.3",
     "sass": "^1.32.7",
     "sass-loader": "^12.0.0",
     "typescript": "~4.5.5",
     "vue-template-compiler": "^2.6.14"
+  },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "ignorePatterns": [
+      "node_modules",
+      "customer-service"
+    ],
+    "extends": [
+      "plugin:vue/essential",
+      "@vue/standard",
+      "@vue/typescript/recommended"
+    ],
+    "parserOptions": {
+      "ecmaVersion": 2020
+    },
+    "rules": {
+      "indent": "off",
+      "quotes": "off",
+      "comma-dangle": "off",
+      "space-before-function-paren": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/camelcase": "off",
+      "no-useless-constructor": "off",
+      "@typescript-eslint/no-namespace": "off"
     }
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead"
+  ]
 }

src/main.ts

@@ -3,8 +3,11 @@ import App from './App.vue'
 import './registerServiceWorker'
 import router from './router'
 import store from './store'
+import element from 'element-ui'
+import 'element-ui/lib/theme-chalk/index.css'
 
 Vue.config.productionTip = false
+Vue.use(element)
 
 new Vue({
     router,

src/store/index.ts

 import Vue from 'vue'
 import Vuex from 'vuex'
-
+import { RootStore, RootStoreState } from './model'
+import chatStore, { ns as chatStoreNs } from '@/customer-service/store/index'
 Vue.use(Vuex)
 
-export default new Vuex.Store({
-    state: {},
-    getters: {},
-    mutations: {},
-    actions: {},
-    modules: {},
+export default new Vuex.Store<RootStoreState>({
+    state: {
+        [RootStore.STATE_ROOT_STATE]: true,
+    },
+    modules: { [chatStoreNs]: chatStore },
 })

src/store/model.ts

+export namespace RootStore {
+    export const STATE_ROOT_STATE = "rootState"
+    export type STATE_ROOT_STATE = boolean
+}
+
+export interface RootStoreState {
+    [RootStore.STATE_ROOT_STATE]: RootStore.STATE_ROOT_STATE
+}

tsconfig.json

@@ -4,13 +4,12 @@
     "module": "esnext",
     "strict": true,
     "jsx": "preserve",
+    "importHelpers": true,
     "moduleResolution": "node",
     "experimentalDecorators": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "useDefineForClassFields": true,
     "sourceMap": true,
     "baseUrl": ".",
     "types": [

vue.config.js

 const { defineConfig } = require('@vue/cli-service')
+const webpack = require('webpack')
+const CompressionPlugin = require('compression-webpack-plugin')
+const pro = process.env.NODE_ENV === 'production'
+
 module.exports = defineConfig({
-  transpileDependencies: true
+    transpileDependencies: true,
+    chainWebpack: (config) => {
+        config.plugin('ignoreMoment').use(webpack.ContextReplacementPlugin, [/moment[/\\]locale$/, /zh-cn/])
+
+        config.plugin('lodash').use(webpack.ProvidePlugin, [{ _: 'lodash' }])
+    },
+    configureWebpack: (config) => {
+        // 配置别名等放到这里
+
+        // 用以解决在chrome sources中vue文件生成带hash而无法找准文件的问题
+        if (!pro) {
+            config.output.devtoolModuleFilenameTemplate = (info) => {
+                const resPath = info.resourcePath
+                if ((/\.vue$/.test(resPath) && !/type=script/.test(info.identifier)) || /node_modules/.test(resPath)) {
+                    return `webpack:///${resPath}?${info.hash}`
+                }
+                return `webpack:///${resPath.replace('./src', 'my-code/src')}`
+            }
+        } else {
+            config.plugins.push(
+                new CompressionPlugin({
+                    filename: '[path].gz[query]',
+                    algorithm: 'gzip',
+                    test: /\.js$|\.html$|.\css/, // 匹配文件名
+                    threshold: 10240, // 对超过10k的数据压缩
+                    minRatio: 0.8, // 只有压缩好这个比率的资产才能被处理
+                    deleteOriginalAssets: false,
+                })
+            )
+        }
+    },
 })