初始化仓库
This commit is contained in:
parent
f303c5b483
commit
32a5df1ae1
|
@ -1,5 +1,14 @@
|
|||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
],
|
||||
"plugins": [
|
||||
[
|
||||
"component",
|
||||
{
|
||||
"libraryName": "element-ui",
|
||||
"styleLibraryName": "theme-chalk"
|
||||
}
|
||||
]
|
||||
]
|
||||
}
|
||||
|
|
|
@ -0,0 +1,210 @@
|
|||
{
|
||||
root: 'F:\\Project\\VUE_project\\demo02',
|
||||
registry: 'https://registry.npmmirror.com',
|
||||
pkgs: [
|
||||
{
|
||||
name: 'sass-loader',
|
||||
version: '7',
|
||||
type: 'range',
|
||||
alias: undefined,
|
||||
arg: [Result]
|
||||
},
|
||||
{
|
||||
name: 'node-sass',
|
||||
version: '4',
|
||||
type: 'range',
|
||||
alias: undefined,
|
||||
arg: [Result]
|
||||
}
|
||||
],
|
||||
production: false,
|
||||
cacheStrict: false,
|
||||
cacheDir: 'C:\\Users\\李龙龙\\.npminstall_tarball',
|
||||
env: {
|
||||
npm_config_registry: 'https://registry.npmmirror.com',
|
||||
npm_config_argv: '{"remain":[],"cooked":["--fix-bug-versions","--china","--userconfig=C:\\\\Users\\\\李龙龙\\\\.cnpmrc","--disturl=https://cdn.npmmirror.com/binaries/node","--registry=https://registry.npmmirror.com","sass-loader@7","node-sass@4","-D"],"original":["--fix-bug-versions","--china","--userconfig=C:\\\\Users\\\\李龙龙\\\\.cnpmrc","--disturl=https://cdn.npmmirror.com/binaries/node","--registry=https://registry.npmmirror.com","sass-loader@7","node-sass@4","-D"]}',
|
||||
npm_config_user_agent: 'npminstall/7.12.0 npm/? node/v20.9.0 win32 x64',
|
||||
npm_config_cache: 'C:\\Users\\李龙龙\\.npminstall_tarball',
|
||||
NODE: 'F:\\Environment\\node-v20.9.0-win-x64\\node.exe',
|
||||
npm_node_execpath: 'F:\\Environment\\node-v20.9.0-win-x64\\node.exe',
|
||||
npm_execpath: 'F:\\Environment\\node-v20.9.0-win-x64\\node_modules\\cnpm\\node_modules\\npminstall\\bin\\install.js',
|
||||
npm_config_userconfig: 'C:\\Users\\李龙龙\\.cnpmrc',
|
||||
npm_config_disturl: 'https://cdn.npmmirror.com/binaries/node',
|
||||
npm_config_r: 'https://registry.npmmirror.com',
|
||||
COREPACK_NPM_REGISTRY: 'https://registry.npmmirror.com',
|
||||
NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
|
||||
NVM_NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
|
||||
PHANTOMJS_CDNURL: 'https://cdn.npmmirror.com/binaries/phantomjs',
|
||||
CHROMEDRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/chromedriver',
|
||||
OPERADRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/operadriver',
|
||||
CYPRESS_DOWNLOAD_PATH_TEMPLATE: 'https://cdn.npmmirror.com/binaries/cypress/${version}/${platform}-${arch}/cypress.zip',
|
||||
ELECTRON_MIRROR: 'https://cdn.npmmirror.com/binaries/electron/',
|
||||
ELECTRON_BUILDER_BINARIES_MIRROR: 'https://cdn.npmmirror.com/binaries/electron-builder-binaries/',
|
||||
SASS_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-sass',
|
||||
SWC_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-swc',
|
||||
NWJS_URLBASE: 'https://cdn.npmmirror.com/binaries/nwjs/v',
|
||||
PUPPETEER_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
|
||||
PUPPETEER_DOWNLOAD_BASE_URL: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
|
||||
PLAYWRIGHT_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/playwright',
|
||||
SENTRYCLI_CDNURL: 'https://cdn.npmmirror.com/binaries/sentry-cli',
|
||||
SAUCECTL_INSTALL_BINARY_MIRROR: 'https://cdn.npmmirror.com/binaries/saucectl',
|
||||
RE2_DOWNLOAD_MIRROR: 'https://cdn.npmmirror.com/binaries/node-re2',
|
||||
RE2_DOWNLOAD_SKIP_PATH: 'true',
|
||||
PRISMA_ENGINES_MIRROR: 'https://cdn.npmmirror.com/binaries/prisma',
|
||||
npm_config_better_sqlite3_binary_host: 'https://cdn.npmmirror.com/binaries/better-sqlite3',
|
||||
npm_config_keytar_binary_host: 'https://cdn.npmmirror.com/binaries/keytar',
|
||||
npm_config_sharp_binary_host: 'https://cdn.npmmirror.com/binaries/sharp',
|
||||
npm_config_sharp_libvips_binary_host: 'https://cdn.npmmirror.com/binaries/sharp-libvips',
|
||||
npm_config_robotjs_binary_host: 'https://cdn.npmmirror.com/binaries/robotjs',
|
||||
npm_rootpath: 'F:\\Project\\VUE_project\\demo02',
|
||||
INIT_CWD: 'F:\\Project\\VUE_project\\demo02'
|
||||
},
|
||||
binaryMirrors: {
|
||||
ENVS: {
|
||||
COREPACK_NPM_REGISTRY: 'https://registry.npmmirror.com',
|
||||
NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
|
||||
NVM_NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
|
||||
PHANTOMJS_CDNURL: 'https://cdn.npmmirror.com/binaries/phantomjs',
|
||||
CHROMEDRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/chromedriver',
|
||||
OPERADRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/operadriver',
|
||||
CYPRESS_DOWNLOAD_PATH_TEMPLATE: 'https://cdn.npmmirror.com/binaries/cypress/${version}/${platform}-${arch}/cypress.zip',
|
||||
ELECTRON_MIRROR: 'https://cdn.npmmirror.com/binaries/electron/',
|
||||
ELECTRON_BUILDER_BINARIES_MIRROR: 'https://cdn.npmmirror.com/binaries/electron-builder-binaries/',
|
||||
SASS_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-sass',
|
||||
SWC_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-swc',
|
||||
NWJS_URLBASE: 'https://cdn.npmmirror.com/binaries/nwjs/v',
|
||||
PUPPETEER_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
|
||||
PUPPETEER_DOWNLOAD_BASE_URL: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
|
||||
PLAYWRIGHT_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/playwright',
|
||||
SENTRYCLI_CDNURL: 'https://cdn.npmmirror.com/binaries/sentry-cli',
|
||||
SAUCECTL_INSTALL_BINARY_MIRROR: 'https://cdn.npmmirror.com/binaries/saucectl',
|
||||
RE2_DOWNLOAD_MIRROR: 'https://cdn.npmmirror.com/binaries/node-re2',
|
||||
RE2_DOWNLOAD_SKIP_PATH: 'true',
|
||||
PRISMA_ENGINES_MIRROR: 'https://cdn.npmmirror.com/binaries/prisma',
|
||||
npm_config_better_sqlite3_binary_host: 'https://cdn.npmmirror.com/binaries/better-sqlite3',
|
||||
npm_config_keytar_binary_host: 'https://cdn.npmmirror.com/binaries/keytar',
|
||||
npm_config_sharp_binary_host: 'https://cdn.npmmirror.com/binaries/sharp',
|
||||
npm_config_sharp_libvips_binary_host: 'https://cdn.npmmirror.com/binaries/sharp-libvips',
|
||||
npm_config_robotjs_binary_host: 'https://cdn.npmmirror.com/binaries/robotjs'
|
||||
},
|
||||
'@ali/s2': { host: 'https://cdn.npmmirror.com/binaries/looksgood-s2' },
|
||||
sharp: { replaceHostFiles: [Array], replaceHostMap: [Object] },
|
||||
'@tensorflow/tfjs-node': {
|
||||
replaceHostFiles: [Array],
|
||||
replaceHostRegExpMap: [Object],
|
||||
replaceHostMap: [Object]
|
||||
},
|
||||
cypress: {
|
||||
host: 'https://cdn.npmmirror.com/binaries/cypress',
|
||||
newPlatforms: [Object]
|
||||
},
|
||||
'utf-8-validate': {
|
||||
host: 'https://cdn.npmmirror.com/binaries/utf-8-validate/v{version}'
|
||||
},
|
||||
xprofiler: {
|
||||
remote_path: './xprofiler/v{version}/',
|
||||
host: 'https://cdn.npmmirror.com/binaries'
|
||||
},
|
||||
leveldown: { host: 'https://cdn.npmmirror.com/binaries/leveldown/v{version}' },
|
||||
couchbase: { host: 'https://cdn.npmmirror.com/binaries/couchbase/v{version}' },
|
||||
gl: { host: 'https://cdn.npmmirror.com/binaries/gl/v{version}' },
|
||||
sqlite3: {
|
||||
host: 'https://cdn.npmmirror.com/binaries/sqlite3',
|
||||
remote_path: 'v{version}'
|
||||
},
|
||||
'@journeyapps/sqlcipher': { host: 'https://cdn.npmmirror.com/binaries' },
|
||||
grpc: {
|
||||
host: 'https://cdn.npmmirror.com/binaries',
|
||||
remote_path: '{name}/v{version}'
|
||||
},
|
||||
'grpc-tools': { host: 'https://cdn.npmmirror.com/binaries' },
|
||||
wrtc: {
|
||||
host: 'https://cdn.npmmirror.com/binaries',
|
||||
remote_path: '{name}/v{version}'
|
||||
},
|
||||
fsevents: { host: 'https://cdn.npmmirror.com/binaries/fsevents' },
|
||||
nodejieba: { host: 'https://cdn.npmmirror.com/binaries/nodejieba' },
|
||||
canvas: { host: 'https://cdn.npmmirror.com/binaries/canvas' },
|
||||
'skia-canvas': { host: 'https://cdn.npmmirror.com/binaries/skia-canvas' },
|
||||
'flow-bin': {
|
||||
replaceHost: 'https://github.com/facebook/flow/releases/download/v',
|
||||
host: 'https://cdn.npmmirror.com/binaries/flow/v'
|
||||
},
|
||||
'jpegtran-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/jpegtran-bin'
|
||||
},
|
||||
'cwebp-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/cwebp-bin'
|
||||
},
|
||||
'zopflipng-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/zopflipng-bin'
|
||||
},
|
||||
'optipng-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/optipng-bin'
|
||||
},
|
||||
mozjpeg: {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/mozjpeg-bin'
|
||||
},
|
||||
gifsicle: {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/gifsicle-bin'
|
||||
},
|
||||
'pngquant-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/pngquant-bin',
|
||||
replaceHostMap: [Object]
|
||||
},
|
||||
'pngcrush-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/pngcrush-bin'
|
||||
},
|
||||
'jpeg-recompress-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/jpeg-recompress-bin'
|
||||
},
|
||||
'advpng-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/advpng-bin'
|
||||
},
|
||||
'pngout-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/pngout-bin'
|
||||
},
|
||||
'jpegoptim-bin': {
|
||||
replaceHost: [Array],
|
||||
host: 'https://cdn.npmmirror.com/binaries/jpegoptim-bin'
|
||||
},
|
||||
argon2: { host: 'https://cdn.npmmirror.com/binaries/argon2' },
|
||||
'ali-zeromq': { host: 'https://cdn.npmmirror.com/binaries/ali-zeromq' },
|
||||
'ali-usb_ctl': { host: 'https://cdn.npmmirror.com/binaries/ali-usb_ctl' },
|
||||
'gdal-async': { host: 'https://cdn.npmmirror.com/binaries/node-gdal-async' },
|
||||
'libpg-query': { host: 'https://cdn.npmmirror.com/binaries' }
|
||||
},
|
||||
forbiddenLicenses: null,
|
||||
flatten: false,
|
||||
proxy: undefined,
|
||||
prune: false,
|
||||
disableFallbackStore: false,
|
||||
workspacesMap: Map(0) {},
|
||||
enableWorkspace: false,
|
||||
workspaceRoot: 'F:\\Project\\VUE_project\\demo02',
|
||||
isWorkspaceRoot: true,
|
||||
isWorkspacePackage: false,
|
||||
offline: false,
|
||||
strictSSL: true,
|
||||
ignoreScripts: false,
|
||||
foregroundScripts: false,
|
||||
ignoreOptionalDependencies: false,
|
||||
detail: false,
|
||||
forceLinkLatest: false,
|
||||
trace: false,
|
||||
engineStrict: false,
|
||||
registryOnly: false,
|
||||
client: false,
|
||||
autoFixVersion: [Function: autoFixVersion]
|
||||
}
|
File diff suppressed because it is too large
Load Diff
|
@ -9,6 +9,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"element-ui": "^2.15.8",
|
||||
"vue": "^2.6.11"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
@ -16,6 +17,7 @@
|
|||
"@vue/cli-plugin-eslint": "~4.5.15",
|
||||
"@vue/cli-service": "~4.5.15",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"babel-plugin-component": "^1.1.1",
|
||||
"eslint": "^6.7.2",
|
||||
"eslint-plugin-vue": "^6.2.2",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
import Vue from 'vue'
|
||||
import { Button, Tag } from 'element-ui'
|
||||
Vue.use(Button)
|
||||
Vue.use(Tag)
|
14
src/App.vue
14
src/App.vue
|
@ -1,28 +1,24 @@
|
|||
<template>
|
||||
<div id="app">
|
||||
<img alt="Vue logo" src="./assets/logo.png">
|
||||
<HelloWorld msg="Welcome to Your Vue.js App"/>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HelloWorld from './components/HelloWorld.vue'
|
||||
//import HelloWorld from './components/Home.vue'
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
HelloWorld
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style lang="scss">
|
||||
@import "./assets/css/reset.css";
|
||||
#app {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -0,0 +1,54 @@
|
|||
|
||||
html{height:100%;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;-webkit-font-smoothing:antialiased;}
|
||||
|
||||
body{margin:0;padding:0;background-color:#fff;min-height:100%;height:auto !important;height:100%;text-align:center;color:#404040;font:12px/1.5 Helvetica,arial;}
|
||||
|
||||
h1,h2,h3,h4,h5,h6,p,figure,form{margin:0;}
|
||||
|
||||
table{border-collapse:collapse; border-spacing:0;}
|
||||
|
||||
img{border:0;vertical-align:middle;-ms-interpolation-mode: bicubic;}
|
||||
|
||||
a{text-decoration:none;color:#29B4F0;}
|
||||
|
||||
a:focus {outline: thin dotted;}
|
||||
|
||||
a:hover{color:#017CB9;text-decoration:underline;}
|
||||
|
||||
/* hn */
|
||||
|
||||
h1{font-size:16px;line-height:36px;}
|
||||
|
||||
h2{font-size:14px;line-height:30px;}
|
||||
|
||||
h3{line-height:24px;}
|
||||
|
||||
h3,h4,h5,h6{font-size:12px;}
|
||||
|
||||
/* ul ol dl */
|
||||
|
||||
ul,li,ol{margin: 0;padding:0;list-style: none outside none;}
|
||||
|
||||
ul.has-style li,ol li{margin-left:25px;}
|
||||
|
||||
ul.has-style li{list-style:disc;}
|
||||
|
||||
ol li{list-style:decimal;}
|
||||
|
||||
ul.inline-style li{float:left;display:inline;}
|
||||
|
||||
dl{margin-bottom: 18px;}
|
||||
|
||||
dt{font-weight: bold;}
|
||||
|
||||
dd{margin:0 0 0 9px;padding:0;}
|
||||
|
||||
svg:not(:root) { overflow: hidden;}
|
||||
|
||||
/* clearfix */
|
||||
|
||||
.clearfix:before, .clearfix:after {content:""; display:table;}
|
||||
|
||||
.clearfix:after{clear:both;overflow:hidden;}
|
||||
|
||||
.clearfix{zoom:1;}
|
|
@ -1,58 +0,0 @@
|
|||
<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-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
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
h3 {
|
||||
margin: 40px 0 0;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
}
|
||||
a {
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,65 @@
|
|||
<template>
|
||||
<div class="hello">
|
||||
<h1>Hello</h1>
|
||||
<el-row>
|
||||
<el-button>默认按钮</el-button>
|
||||
<el-button type="primary">主要按钮</el-button>
|
||||
<el-button type="success">成功按钮</el-button>
|
||||
<el-button type="info">信息按钮</el-button>
|
||||
<el-button type="warning">警告按钮</el-button>
|
||||
<el-button type="danger">危险按钮</el-button>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-button plain>朴素按钮</el-button>
|
||||
<el-button type="primary" plain>主要按钮</el-button>
|
||||
<el-button type="success" plain>成功按钮</el-button>
|
||||
<el-button type="info" plain>信息按钮</el-button>
|
||||
<el-button type="warning" plain>警告按钮</el-button>
|
||||
<el-button type="danger" plain>危险按钮</el-button>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-button round>圆角按钮</el-button>
|
||||
<el-button type="primary" round>主要按钮</el-button>
|
||||
<el-button type="success" round>成功按钮</el-button>
|
||||
<el-button type="info" round>信息按钮</el-button>
|
||||
<el-button type="warning" round>警告按钮</el-button>
|
||||
<el-button type="danger" round>危险按钮</el-button>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-button icon="el-icon-search" circle></el-button>
|
||||
<el-button type="primary" icon="el-icon-edit" circle></el-button>
|
||||
<el-button type="success" icon="el-icon-check" circle></el-button>
|
||||
<el-button type="info" icon="el-icon-message" circle></el-button>
|
||||
<el-button type="warning" icon="el-icon-star-off" circle></el-button>
|
||||
<el-button type="danger" icon="el-icon-delete" circle></el-button>
|
||||
</el-row>
|
||||
|
||||
<el-tag> 哈哈哈</el-tag>
|
||||
<i class="fa fa-users"></i>
|
||||
<i class="fa fa-user"></i>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
props: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style lang="less">
|
||||
.hello {
|
||||
background: yellow;
|
||||
.el-button {
|
||||
color: aqua;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
|
@ -0,0 +1,76 @@
|
|||
<template>
|
||||
<div class="login">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>后台管理系统</span>
|
||||
</div>
|
||||
<el-form label-width="80px" :model="form" ref="form">
|
||||
<el-form-item label="用户名" prop="username"
|
||||
:rules="[
|
||||
{required: true, message:'请输入用户名', trigger: 'blur'},
|
||||
{min: 4, max: 10, message: '长度在4-10位数之间', trigger: 'blur'}
|
||||
]">
|
||||
<el-input v-model="form.username"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码" prop="password"
|
||||
:rules="[
|
||||
{required: true, message:'请输入密码', trigger: 'blur'},
|
||||
{min: 6, max: 12, message: '密码长度在6-12位数之间', trigger: 'blur'}
|
||||
]">
|
||||
<el-input type='password' v-model="form.password" ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="login('form')">登录</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
username: '',
|
||||
password: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
login(form) {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if(valid) {
|
||||
console.log(this.form)
|
||||
} else {
|
||||
console.error(this.form)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.login {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;;
|
||||
background: #017CB9;
|
||||
.box-card {
|
||||
width: 450px;
|
||||
margin: 200px auto;
|
||||
.el-card__header {
|
||||
font-size: 34px;
|
||||
}
|
||||
.el-button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
16
src/main.js
16
src/main.js
|
@ -1,8 +1,24 @@
|
|||
import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
import axios from 'axios'
|
||||
import router from './router'
|
||||
import 'font-awesome/css/font-awesome.min.css'
|
||||
|
||||
/*//模块化按需引入
|
||||
import '../plugins/element.js'*/
|
||||
|
||||
//全局引入
|
||||
|
||||
import ElementUI from 'element-ui'
|
||||
import 'element-ui/lib/theme-chalk/index.css'
|
||||
|
||||
Vue.use(ElementUI)
|
||||
|
||||
|
||||
Vue.prototype.axios = axios // 挂载到原型,可以在全局使用
|
||||
Vue.config.productionTip = false
|
||||
|
||||
new Vue({
|
||||
router,
|
||||
render: h => h(App),
|
||||
}).$mount('#app')
|
||||
|
|
|
@ -0,0 +1,26 @@
|
|||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
// import Home from '../components/Home.vue'
|
||||
|
||||
Vue.use(Router)
|
||||
export default new Router({
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
redirect: '/login',
|
||||
component: () => import('@/components/Login')
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
component: () => import('@/components/Login') // 异步引入
|
||||
},
|
||||
{
|
||||
path: '/home',
|
||||
//component: Home
|
||||
//component: () => import('@/components/Home') //ES 中的 import引入
|
||||
component: resolve => require(['@/components/Home'], resolve) // 异步引入
|
||||
}
|
||||
],
|
||||
mode: 'history'
|
||||
})
|
|
@ -0,0 +1,6 @@
|
|||
module.exports = {
|
||||
devServer: {
|
||||
open: true
|
||||
}
|
||||
|
||||
}
|
Loading…
Reference in New Issue