项目准备

ChenMingK · Mar 25, 2019 · 02fd4d4 · 02fd4d4
1 parent 5337db3
commit 02fd4d4
Show file tree

Hide file tree

Showing 39 changed files with 439 additions and 122 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -9,7 +9,9 @@ module.exports = {
   ],
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'no-trailing-spaces': 'off',
+
   },
   parserOptions: {
     parser: 'babel-eslint'

diff --git a/package.json b/package.json
@@ -20,6 +20,8 @@
     "babel-eslint": "^10.0.1",
     "eslint": "^5.8.0",
     "eslint-plugin-vue": "^5.0.0",
+    "node-sass": "^4.11.0",
+    "sass-loader": "^7.1.0",
     "vue-template-compiler": "^2.5.21"
   }
 }
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/fonts/Pamplona.css b/public/fonts/Pamplona.css
@@ -0,0 +1,8 @@
+@font-face {
+    font-family: 'Pamplona';   /* 字体名称 */
+    font-style: normal;     /* 字体样式 */
+    font-weight: 400;       /* 字体粗细 */
+    src: url('Pamplona.woff2') format('Pamplona');  /* 字体文件路径 */
+    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+  }
+
diff --git a/public/fonts/Pamplona.woff2 b/public/fonts/Pamplona.woff2
diff --git a/public/fonts/cabin.css b/public/fonts/cabin.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Cabin';   /* 字体名称 */
+  font-style: normal;     /* 字体样式 */
+  font-weight: 400;       /* 字体粗细 */
+  src: url('cabin.woff2') format('woff2');  /* 字体文件路径 */
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/public/fonts/cabin.woff2 b/public/fonts/cabin.woff2
diff --git a/public/fonts/daysOne.css b/public/fonts/daysOne.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Days One';
+  font-style: normal;
+  font-weight: 400;
+  src: url('daysOne.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/public/fonts/daysOne.woff2 b/public/fonts/daysOne.woff2
diff --git a/public/fonts/montserrat.css b/public/fonts/montserrat.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Montserrat';
+  font-style: normal;
+  font-weight: 400;
+  src: url('montserrat.woff2') format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
diff --git a/public/fonts/montserrat.woff2 b/public/fonts/montserrat.woff2
diff --git a/public/fonts/tangerine.css b/public/fonts/tangerine.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Tangerine';
+  font-style: normal;
+  font-weight: 400;
+  src: url('tangerine.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/public/fonts/tangerine.woff2 b/public/fonts/tangerine.woff2
diff --git a/public/index.html b/public/index.html
@@ -3,8 +3,10 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0,
+    maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <!-- <link rel="stylesheet" href="<%= BASE_URL%>fonts/daysOne.css"> -->
     <title>imooc-demo</title>
   </head>
   <body>

diff --git a/src/App.vue b/src/App.vue
@@ -1,31 +1,39 @@
 <template>
   <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </div>
+    <span class="text">ABCDEFG</span>
+    <span class="icon-add"></span>
     <router-view/>
   </div>
 </template>
 
-<style>
-#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>
+/* eslint-disable */
+  import { mapGetters } from 'vuex'
+  export default {
+    computed: {
+      ...mapGetters(['test'])     // vuex语法 mapGetters是一个方法,参数当作keys数组？
+    },
+    mounted () {
+      this.$store.dispatch('setTest', 9).then(() => {
+        console.log(this.test)  // this.$store.state.book.test
+      })
+    }
+  }
+  document.addEventListener('DOMContentLoaded', () => {  // DOM加载完毕后回调
+    const html = document.querySelector('html')          // 取到html根元素
+    let fontSize = window.innerWidth / 10                // 800 -> 80 -> 1rem = 80px 
+    fontSize = fontSize > 50 ? 50 : fontSize             // 设置一个最大上限  
+    html.style.fontSize = fontSize + 'px'                // 设置根元素默认字体大小
+  })
 
-#nav a {
-  font-weight: bold;
-  color: #2c3e50;
-}
+</script>
+
+<style lang="scss" scoped> /* scoped只在当前文件内有效 */
+  @import "./assets/styles/global";
+  .text {
+    font-family: 'Days One';
+    color: orange;
+    font-size: px2rem(20);
+  }
 
-#nav a.router-link-exact-active {
-  color: #42b983;
-}
 </style>
diff --git a/src/assets/fonts/cabin.css b/src/assets/fonts/cabin.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Cabin';   /* 字体名称 */
+  font-style: normal;     /* 字体样式 */
+  font-weight: 400;       /* 字体粗细 */
+  src: url('cabin.woff2') format('woff2');  /* 字体文件路径 */
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/src/assets/fonts/cabin.woff2 b/src/assets/fonts/cabin.woff2
diff --git a/src/assets/fonts/daysOne.css b/src/assets/fonts/daysOne.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Days One';
+  font-style: normal;
+  font-weight: 400;
+  src: url('daysOne.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/src/assets/fonts/daysOne.woff2 b/src/assets/fonts/daysOne.woff2
diff --git a/src/assets/fonts/montserrat.css b/src/assets/fonts/montserrat.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Montserrat';
+  font-style: normal;
+  font-weight: 400;
+  src: url('montserrat.woff2') format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
diff --git a/src/assets/fonts/montserrat.woff2 b/src/assets/fonts/montserrat.woff2
diff --git a/src/assets/fonts/tangerine.css b/src/assets/fonts/tangerine.css
@@ -0,0 +1,7 @@
+@font-face {
+  font-family: 'Tangerine';
+  font-style: normal;
+  font-weight: 400;
+  src: url('tangerine.woff2') format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
diff --git a/src/assets/fonts/tangerine.woff2 b/src/assets/fonts/tangerine.woff2
diff --git a/src/assets/styles/fonts/icomoon.eot b/src/assets/styles/fonts/icomoon.eot