Browse Source

项目配置

panhui 5 years ago
parent
commit
d6082591bb
20 changed files with 828 additions and 229 deletions
  1. 3 3
      .browserslistrc
  2. 17 12
      .eslintrc.js
  3. 1 0
      .gitignore
  4. 21 0
      .prettierrc.js
  5. 1 1
      README.md
  6. 1 1
      babel.config.js
  7. 5 0
      package.json
  8. 16 24
      src/App.vue
  9. 91 111
      src/components/HelloWorld.vue
  10. 11 0
      src/element-variables.scss
  11. 9 8
      src/main.js
  12. 5 0
      src/plugins/element.js
  13. 26 20
      src/router/index.js
  14. 8 6
      src/store/index.js
  15. 63 0
      src/styles/common.less
  16. 39 0
      src/styles/font.less
  17. 0 5
      src/views/About.vue
  18. 4 11
      src/views/Home.vue
  19. 25 0
      vue.config.js
  20. 482 27
      yarn.lock

+ 3 - 3
.browserslistrc

@@ -1,3 +1,3 @@
-> 1%
-last 2 versions
-not dead
+last 1 version
+> 5% in alt-AS
+IE 10

+ 17 - 12
.eslintrc.js

@@ -1,14 +1,19 @@
 module.exports = {
-  root: true,
-  env: {
-    node: true,
-  },
-  extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"],
-  parserOptions: {
-    parser: "babel-eslint",
-  },
-  rules: {
-    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
-    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
-  },
+    root: true,
+    env: {
+        node: true
+    },
+    extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/prettier'],
+    parserOptions: {
+        parser: 'babel-eslint'
+    },
+    plugins: ['prettier'],
+    rules: {
+        'prettier/prettier': 'off',
+        'no-console': 'off',
+        'no-debugger': 'off',
+        'vue/no-unused-components': 'warn',
+        'vue/no-unused-vars': 'warn',
+        'vue/no-use-v-if-with-v-for': 'off'
+    }
 };

+ 1 - 0
.gitignore

@@ -21,3 +21,4 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
+*.lock

+ 21 - 0
.prettierrc.js

@@ -0,0 +1,21 @@
+module.exports = {
+    printWidth: 120,
+    singleQuote: true,
+    tabWidth: 4,
+    arrowParens: 'avoid',
+    trailingComma: 'none',
+    overrides: [
+        {
+            files: '*.html',
+            options: {
+                parser: 'html'
+            }
+        },
+        {
+            files: '*.vue',
+            options: {
+                parser: 'vue'
+            }
+        }
+    ]
+};

+ 1 - 1
README.md

@@ -21,4 +21,4 @@ yarn lint
 ```
 
 ### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
+智戎管理平台官网

+ 1 - 1
babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
+    presets: ['@vue/cli-plugin-babel/preset']
 };

+ 5 - 0
package.json

@@ -8,7 +8,9 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "axios": "^0.21.1",
     "core-js": "^3.6.5",
+    "element-ui": "^2.4.5",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"
@@ -27,7 +29,10 @@
     "less": "^3.0.4",
     "less-loader": "^5.0.0",
     "lint-staged": "^9.5.0",
+    "node-sass": "^4.9.2",
     "prettier": "^2.2.1",
+    "sass-loader": "^7.0.3",
+    "vue-cli-plugin-element": "^1.0.1",
     "vue-template-compiler": "^2.6.11"
   },
   "gitHooks": {

+ 16 - 24
src/App.vue

@@ -1,32 +1,24 @@
 <template>
-  <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
+    <div id="app">
+        <keep-alive>
+            <router-view class="appContainer" />
+        </keep-alive>
     </div>
-    <router-view />
-  </div>
 </template>
 
-<style lang="less">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
-
-#nav {
-  padding: 30px;
+<script>
+export default {
+    name: 'app'
+};
+</script>
 
-  a {
-    font-weight: bold;
+<style>
+#app {
+    font-family: 'Avenir', Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    text-align: center;
     color: #2c3e50;
-
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
+    margin-top: 60px;
 }
 </style>

+ 91 - 111
src/components/HelloWorld.vue

@@ -1,130 +1,110 @@
 <template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br />
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener"
-        >vue-cli documentation</a
-      >.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
-          target="_blank"
-          rel="noopener"
-          >babel</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
-          target="_blank"
-          rel="noopener"
-          >router</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
-          target="_blank"
-          rel="noopener"
-          >vuex</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
-          target="_blank"
-          rel="noopener"
-          >eslint</a
-        >
-      </li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li>
-        <a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
-      </li>
-      <li>
-        <a href="https://forum.vuejs.org" target="_blank" rel="noopener"
-          >Forum</a
-        >
-      </li>
-      <li>
-        <a href="https://chat.vuejs.org" target="_blank" rel="noopener"
-          >Community Chat</a
-        >
-      </li>
-      <li>
-        <a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
-          >Twitter</a
-        >
-      </li>
-      <li>
-        <a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
-      </li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li>
-        <a href="https://router.vuejs.org" target="_blank" rel="noopener"
-          >vue-router</a
-        >
-      </li>
-      <li>
-        <a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-devtools#vue-devtools"
-          target="_blank"
-          rel="noopener"
-          >vue-devtools</a
-        >
-      </li>
-      <li>
-        <a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
-          >vue-loader</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/awesome-vue"
-          target="_blank"
-          rel="noopener"
-          >awesome-vue</a
-        >
-      </li>
-    </ul>
-  </div>
+    <div class="hello">
+        <h1>{{ msg }}</h1>
+        <p>
+            For a guide and recipes on how to configure / customize this project,<br />
+            check out the
+            <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
+        </p>
+        <h3>Installed CLI Plugins</h3>
+        <ul>
+            <li>
+                <a
+                    href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
+                    target="_blank"
+                    rel="noopener"
+                    >babel</a
+                >
+            </li>
+            <li>
+                <a
+                    href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
+                    target="_blank"
+                    rel="noopener"
+                    >router</a
+                >
+            </li>
+            <li>
+                <a
+                    href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
+                    target="_blank"
+                    rel="noopener"
+                    >vuex</a
+                >
+            </li>
+            <li>
+                <a
+                    href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
+                    target="_blank"
+                    rel="noopener"
+                    >eslint</a
+                >
+            </li>
+        </ul>
+        <h3>Essential Links</h3>
+        <ul>
+            <li>
+                <a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
+            </li>
+            <li>
+                <a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a>
+            </li>
+            <li>
+                <a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a>
+            </li>
+            <li>
+                <a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a>
+            </li>
+            <li>
+                <a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
+            </li>
+        </ul>
+        <h3>Ecosystem</h3>
+        <ul>
+            <li>
+                <a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a>
+            </li>
+            <li>
+                <a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
+            </li>
+            <li>
+                <a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener"
+                    >vue-devtools</a
+                >
+            </li>
+            <li>
+                <a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a>
+            </li>
+            <li>
+                <a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a>
+            </li>
+        </ul>
+    </div>
 </template>
 
 <script>
 export default {
-  name: "HelloWorld",
-  props: {
-    msg: String,
-  },
+    name: 'HelloWorld',
+    props: {
+        msg: String
+    }
 };
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="less">
 h3 {
-  margin: 40px 0 0;
+    margin: 40px 0 0;
 }
 ul {
-  list-style-type: none;
-  padding: 0;
+    list-style-type: none;
+    padding: 0;
 }
 li {
-  display: inline-block;
-  margin: 0 10px;
+    display: inline-block;
+    margin: 0 10px;
 }
 a {
-  color: #42b983;
+    color: #42b983;
 }
 </style>

+ 11 - 0
src/element-variables.scss

@@ -0,0 +1,11 @@
+/*
+Write your variables here. All available variables can be
+found in element-ui/packages/theme-chalk/src/common/var.scss.
+For example, to overwrite the theme color:
+*/
+$--color-primary: teal;
+
+/* icon font path, required */
+$--font-path: '~element-ui/lib/theme-chalk/fonts';
+
+@import "~element-ui/packages/theme-chalk/src/index";

+ 9 - 8
src/main.js

@@ -1,12 +1,13 @@
-import Vue from "vue";
-import App from "./App.vue";
-import router from "./router";
-import store from "./store";
+import Vue from 'vue';
+import App from './App.vue';
+import router from './router';
+import store from './store';
+import './plugins/element.js'
 
 Vue.config.productionTip = false;
 
 new Vue({
-  router,
-  store,
-  render: (h) => h(App),
-}).$mount("#app");
+    router,
+    store,
+    render: h => h(App)
+}).$mount('#app');

+ 5 - 0
src/plugins/element.js

@@ -0,0 +1,5 @@
+import Vue from 'vue'
+import Element from 'element-ui'
+import '../element-variables.scss'
+
+Vue.use(Element)

+ 26 - 20
src/router/index.js

@@ -1,30 +1,36 @@
-import Vue from "vue";
-import VueRouter from "vue-router";
-import Home from "../views/Home.vue";
+import Vue from 'vue';
+import VueRouter from 'vue-router';
 
 Vue.use(VueRouter);
 
 const routes = [
-  {
-    path: "/",
-    name: "Home",
-    component: Home,
-  },
-  {
-    path: "/about",
-    name: "About",
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () =>
-      import(/* webpackChunkName: "about" */ "../views/About.vue"),
-  },
+    {
+        path: '/',
+        redirect: 'home'
+    },
+    {
+        path: '/home',
+        name: 'home',
+        component: () => import('../views/Home.vue'),
+        meta: {
+            title: '首页'
+        }
+    }
 ];
 
 const router = new VueRouter({
-  mode: "history",
-  base: process.env.BASE_URL,
-  routes,
+    mode: 'history',
+    base: process.env.BASE_URL,
+    routes,
+    scrollBehavior(to, from, savedPosition) {
+        if (to.path !== from.path) {
+            if (savedPosition) {
+                return savedPosition;
+            } else {
+                return { x: 0, y: 0 };
+            }
+        }
+    }
 });
 
 export default router;

+ 8 - 6
src/store/index.js

@@ -1,11 +1,13 @@
-import Vue from "vue";
-import Vuex from "vuex";
+import Vue from 'vue';
+import Vuex from 'vuex';
 
 Vue.use(Vuex);
 
 export default new Vuex.Store({
-  state: {},
-  mutations: {},
-  actions: {},
-  modules: {},
+    state: {
+        userInfo:null,
+    },
+    mutations: {},
+    actions: {},
+    modules: {}
 });

+ 63 - 0
src/styles/common.less

@@ -0,0 +1,63 @@
+@prim: #ff6c00;
+@success: #07c160;
+@danger: #ff6c00;
+@warn: #ff976a;
+@text0: #181818;
+@text1: #323233;
+@text2: #606266;
+@text3: #939599;
+@text4: #c6c8cc;
+@border1: #f5f7fa;
+@border2: #f2f3f5;
+@border3: #dfe1e6;
+@border4: #f2f6fc;
+@bg: #f5f7fa;
+@red:#FD4D49;
+.flex1 {
+    flex-grow: 1;
+}
+.flex() {
+    display: flex;
+    align-items: center;
+}
+.flex-col() {
+    display: flex;
+    flex-direction: column;
+}
+
+.ellipsis() {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.ellipsis-line( @line:2 ) {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: @line;
+    overflow: hidden;
+}
+
+@keyframes iconAnimate {
+    from {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+    }
+
+    20% {
+        -webkit-transform: scale(0.8);
+        transform: scale(0.8);
+    }
+
+    80% {
+        -webkit-transform: scale(1.5);
+        transform: scale(1.5);
+    }
+    100% {
+        -webkit-transform: scale(1);
+        transform: scale(1);
+    }
+}
+.iconAnimate {
+    animation: iconAnimate ease-in-out 0.3s;
+}

+ 39 - 0
src/styles/font.less

@@ -0,0 +1,39 @@
+@font-face {
+    font-family: 'OSP';
+    src: url(https://imttech.oss-cn-hangzhou.aliyuncs.com/micro/OSP-DIN.ttf);
+}
+@font-face {
+    font-family: 'iconfont'; /* Project id 2504712 */
+    src: url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.woff2?t=1620984863369') format('woff2'),
+        url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.woff?t=1620984863369') format('woff'),
+        url('//at.alicdn.com/t/font_2504712_37jeq6r3j0w.ttf?t=1620984863369') format('truetype');
+}
+
+.iconfont {
+    font-family: 'iconfont' !important;
+    font-size: 16px;
+    font-style: normal;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    line-height: 22px;
+}
+
+.iconfont-jiage:before {
+    content: '\e61c';
+}
+
+.iconfont-liebiao:before {
+    content: '\e61d';
+}
+
+.iconfont-button:before {
+    content: '\e61e';
+}
+
+@font-face {
+    font-family: 'color-emoji';
+    src: local('Apple Color Emoji'), local('Segoe UI Emoji'), local('Segoe UI Symbol'), local('Noto Color Emoji');
+}
+article {
+    font-family: 'color-emoji';
+}

+ 0 - 5
src/views/About.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>

+ 4 - 11
src/views/Home.vue

@@ -1,18 +1,11 @@
 <template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png" />
-    <HelloWorld msg="Welcome to Your Vue.js App" />
-  </div>
+    <div class="home">
+        <el-button type="primary" size="default">255</el-button>
+    </div>
 </template>
 
 <script>
-// @ is an alias to /src
-import HelloWorld from "@/components/HelloWorld.vue";
-
 export default {
-  name: "Home",
-  components: {
-    HelloWorld,
-  },
+    name: 'Home'
 };
 </script>

+ 25 - 0
vue.config.js

@@ -0,0 +1,25 @@
+const path = require('path');
+module.exports = {
+    publicPath:
+        process.env.NODE_ENV === 'production'
+            ? 'https://cdn.imttech.cn/index/'
+            : process.env.NODE_ENV === 'test'
+            ? '/index'
+            : '/',
+    devServer: {
+        port: 8081,
+        disableHostCheck: true
+    },
+    pluginOptions: {
+        'style-resources-loader': {
+            preProcessor: 'less',
+            patterns: [path.resolve(__dirname, './src/styles/common.less')]
+        }
+    },
+    chainWebpack: config => {
+        if (process.env.NODE_ENV === 'development') {
+            config.output.filename('[name].[hash].js').end();
+        }
+    },
+    transpileDependencies: ['ssr-window', 'dom7', 'vuex']
+};

File diff suppressed because it is too large
+ 482 - 27
yarn.lock


Some files were not shown because too many files changed in this diff