From 0dd14040ec40ad62e75f348f91a7acbedcea0e2b Mon Sep 17 00:00:00 2001 From: liuqimichale <123456lq> Date: Mon, 25 Mar 2019 11:15:37 +0800 Subject: [PATCH] 路由 favicon scss stick-footer reset.css 懒加载 --- webintroduce/build/webpack.base.conf.js | 11 +++++++++++ webintroduce/index.html | 5 +++-- webintroduce/package-lock.json | 15 +++++++++++++-- webintroduce/package.json | 2 ++ webintroduce/src/App.vue | 23 +++++++++++++++++++---- webintroduce/src/assets/css/reset.css | 137 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ webintroduce/src/assets/logo.png | Bin 6849 -> 0 bytes webintroduce/src/components/HelloWorld.vue | 113 ----------------------------------------------------------------------------------------------------------------- webintroduce/src/components/VFooter.vue | 16 ++++++++++++++++ webintroduce/src/components/VHeader.vue | 40 ++++++++++++++++++++++++++++++++++++++++ webintroduce/src/main.js | 1 + webintroduce/src/router/index.js | 20 ++++++++++++++++---- webintroduce/src/views/VHome.vue | 13 +++++++++++++ webintroduce/src/views/VSolution.vue | 13 +++++++++++++ webintroduce/static/favicon.ico | Bin 0 -> 16687 bytes 15 files changed, 284 insertions(+), 125 deletions(-) create mode 100644 webintroduce/src/assets/css/reset.css delete mode 100644 webintroduce/src/assets/logo.png delete mode 100644 webintroduce/src/components/HelloWorld.vue create mode 100644 webintroduce/src/components/VFooter.vue create mode 100644 webintroduce/src/components/VHeader.vue create mode 100644 webintroduce/src/views/VHome.vue create mode 100644 webintroduce/src/views/VSolution.vue create mode 100644 webintroduce/static/favicon.ico diff --git a/webintroduce/build/webpack.base.conf.js b/webintroduce/build/webpack.base.conf.js index a07e683..c049215 100644 --- a/webintroduce/build/webpack.base.conf.js +++ b/webintroduce/build/webpack.base.conf.js @@ -64,7 +64,18 @@ module.exports = { limit: 10000, name: utils.assetsPath('fonts/[name].[hash:7].[ext]') } + }, + { + test: /\.scss$/, + use: [{ + loader: "style-loader" // creates style nodes from JS strings + }, { + loader: "css-loader" // translates CSS into CommonJS + }, { + loader: "sass-loader" // compiles Sass to CSS + }] } + ] }, node: { diff --git a/webintroduce/index.html b/webintroduce/index.html index a563c44..dbd8ec0 100644 --- a/webintroduce/index.html +++ b/webintroduce/index.html @@ -2,8 +2,9 @@ - - webintroduce + + + 任你停官网
diff --git a/webintroduce/package-lock.json b/webintroduce/package-lock.json index e417b52..592c2d2 100644 --- a/webintroduce/package-lock.json +++ b/webintroduce/package-lock.json @@ -4963,8 +4963,7 @@ }, "js-yaml": { "version": "3.7.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz", - "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=", + "resolved": "", "dev": true, "requires": { "argparse": "^1.0.7", @@ -9513,6 +9512,18 @@ "mkdirp": "~0.5.1", "sax": "~1.2.1", "whet.extend": "~0.9.9" + }, + "dependencies": { + "js-yaml": { + "version": "3.7.0", + "resolved": "http://registry.npm.taobao.org/js-yaml/download/js-yaml-3.7.0.tgz", + "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=", + "dev": true, + "requires": { + "argparse": "^1.0.7", + "esprima": "^2.6.0" + } + } } }, "tapable": { diff --git a/webintroduce/package.json b/webintroduce/package.json index 592e769..ae00cef 100644 --- a/webintroduce/package.json +++ b/webintroduce/package.json @@ -31,6 +31,7 @@ "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", "node-notifier": "^5.1.2", + "node-sass": "^4.11.0", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", "portfinder": "^1.0.13", @@ -38,6 +39,7 @@ "postcss-loader": "^2.0.8", "postcss-url": "^7.2.1", "rimraf": "^2.6.0", + "sass-loader": "^7.1.0", "semver": "^5.3.0", "shelljs": "^0.7.6", "uglifyjs-webpack-plugin": "^1.1.1", diff --git a/webintroduce/src/App.vue b/webintroduce/src/App.vue index d74c648..6110b05 100644 --- a/webintroduce/src/App.vue +++ b/webintroduce/src/App.vue @@ -1,23 +1,38 @@ diff --git a/webintroduce/src/assets/css/reset.css b/webintroduce/src/assets/css/reset.css new file mode 100644 index 0000000..2801608 --- /dev/null +++ b/webintroduce/src/assets/css/reset.css @@ -0,0 +1,137 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v4.0 | 20180602 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +main, menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} + +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, main, menu, nav, section { + display: block; +} + +/* HTML5 hidden-attribute fix for newer browsers */ +*[hidden] { + display: none; +} + +body { + line-height: 1; +} + +/*html, body {*/ +/*width: 100%;*/ +/*height: 100%;*/ +/*background: url("../assets/img/bg.jpg") no-repeat;*/ +/*background-size: 100% 100%;*/ +/*overflow: hidden;*/ +/*}*/ + +html, body{ + height: 100%;width: 100%; + font-family: "Microsoft YaHei"; + color: #fff; + user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + -o-user-select: none; + -moz-user-select: none; +} +body{ + + overflow: hidden; + font-size: 14px; + /*默认颜色*/ +} + +html { + box-sizing: border-box; +} +*, *:before, *:after { + box-sizing: inherit; +} + +ol, ul { + list-style: none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +/*清除浮动*/ +.clearfix:before, +.clearfix:after { + content: " "; + display: inline-block; + height: 0; + clear: both; + visibility: hidden; +} + +.clearfix { + *zoom: 1; +} + +/*隐藏*/ +.dn { + display: none; +} + +.margin0-12 { + margin: 0 12px; +} + +.margin12-0 { + margin: 12px 0; +} +.flexfm{ + flex: 1; +} + +.pos-rel{ + position: relative; +} +.pos-abs{ + position: absolute; +} + + + + + +/*自定义导航选中样式*/ +.navActive{ + background-color: #f00; +} diff --git a/webintroduce/src/assets/logo.png b/webintroduce/src/assets/logo.png deleted file mode 100644 index f3d2503..0000000 Binary files a/webintroduce/src/assets/logo.png and /dev/null differ diff --git a/webintroduce/src/components/HelloWorld.vue b/webintroduce/src/components/HelloWorld.vue deleted file mode 100644 index 1c19f2a..0000000 --- a/webintroduce/src/components/HelloWorld.vue +++ /dev/null @@ -1,113 +0,0 @@ - - - - - - diff --git a/webintroduce/src/components/VFooter.vue b/webintroduce/src/components/VFooter.vue new file mode 100644 index 0000000..9f090e9 --- /dev/null +++ b/webintroduce/src/components/VFooter.vue @@ -0,0 +1,16 @@ + + + + + diff --git a/webintroduce/src/components/VHeader.vue b/webintroduce/src/components/VHeader.vue new file mode 100644 index 0000000..da7c292 --- /dev/null +++ b/webintroduce/src/components/VHeader.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/webintroduce/src/main.js b/webintroduce/src/main.js index 417390e..f34026e 100644 --- a/webintroduce/src/main.js +++ b/webintroduce/src/main.js @@ -4,6 +4,7 @@ import Vue from 'vue' import App from './App' import router from './router' +require ('./assets/css/reset.css') Vue.config.productionTip = false /* eslint-disable no-new */ diff --git a/webintroduce/src/router/index.js b/webintroduce/src/router/index.js index 5fa7f9d..15979df 100644 --- a/webintroduce/src/router/index.js +++ b/webintroduce/src/router/index.js @@ -1,15 +1,27 @@ import Vue from 'vue' import Router from 'vue-router' -import HelloWorld from '@/components/HelloWorld' +import VHome from '../views/VHome' +const VSolution = () => import('../views/VSolution') Vue.use(Router) export default new Router({ + linkExactActiveClass:'navActive', routes: [ { path: '/', - name: 'HelloWorld', - component: HelloWorld - } + name: 'VHome', + component: VHome + }, + { + path: '/home', + name: 'VHome', + component: VHome + }, + { + path: '/solution', + name: 'VSolution', + component: VSolution + }, ] }) diff --git a/webintroduce/src/views/VHome.vue b/webintroduce/src/views/VHome.vue new file mode 100644 index 0000000..df7c1b3 --- /dev/null +++ b/webintroduce/src/views/VHome.vue @@ -0,0 +1,13 @@ + + + + + diff --git a/webintroduce/src/views/VSolution.vue b/webintroduce/src/views/VSolution.vue new file mode 100644 index 0000000..c84c788 --- /dev/null +++ b/webintroduce/src/views/VSolution.vue @@ -0,0 +1,13 @@ + + + + + diff --git a/webintroduce/static/favicon.ico b/webintroduce/static/favicon.ico new file mode 100644 index 0000000..54f3708 Binary files /dev/null and b/webintroduce/static/favicon.ico differ -- libgit2 0.21.4