[+] Init
This commit is contained in:
@@ -1,24 +1,29 @@
|
|||||||
# home-page
|
# home-page
|
||||||
|
|
||||||
## Project setup
|
## Project setup
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn install
|
yarn install
|
||||||
```
|
```
|
||||||
|
|
||||||
### Compiles and hot-reloads for development
|
### Compiles and hot-reloads for development
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn serve
|
yarn serve
|
||||||
```
|
```
|
||||||
|
|
||||||
### Compiles and minifies for production
|
### Compiles and minifies for production
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn build
|
yarn build
|
||||||
```
|
```
|
||||||
|
|
||||||
### Lints and fixes files
|
### Lints and fixes files
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn lint
|
yarn lint
|
||||||
```
|
```
|
||||||
|
|
||||||
### Customize configuration
|
### Customize configuration
|
||||||
|
|
||||||
See [Configuration Reference](https://cli.vuejs.org/config/).
|
See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||||
|
|||||||
+5
-4
@@ -2,14 +2,15 @@
|
|||||||
<html lang="">
|
<html lang="">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta content="width=device-width,initial-scale=1.0" name="viewport">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link href="<%= BASE_URL %>favicon.ico" rel="icon">
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without
|
||||||
|
JavaScript enabled. Please enable it to continue.</strong>
|
||||||
</noscript>
|
</noscript>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<!-- built files will be auto injected -->
|
<!-- built files will be auto injected -->
|
||||||
|
|||||||
+10
-5
@@ -1,13 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="nav">
|
<div id="nav">
|
||||||
<router-link to="/">Home</router-link> |
|
<router-link to="/">Home</router-link>
|
||||||
|
|
|
||||||
<router-link to="/about">About</router-link>
|
<router-link to="/about">About</router-link>
|
||||||
</div>
|
</div>
|
||||||
<router-view/>
|
<router-view/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
#app {
|
#app
|
||||||
|
{
|
||||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
@@ -15,14 +17,17 @@
|
|||||||
color: #2c3e50;
|
color: #2c3e50;
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav {
|
#nav
|
||||||
|
{
|
||||||
padding: 30px;
|
padding: 30px;
|
||||||
|
|
||||||
a {
|
a
|
||||||
|
{
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #2c3e50;
|
color: #2c3e50;
|
||||||
|
|
||||||
&.router-link-exact-active {
|
&.router-link-exact-active
|
||||||
|
{
|
||||||
color: #42b983;
|
color: #42b983;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,30 +4,42 @@
|
|||||||
<p>
|
<p>
|
||||||
For a guide and recipes on how to configure / customize this project,<br>
|
For a guide and recipes on how to configure / customize this project,<br>
|
||||||
check out the
|
check out the
|
||||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
|
<a href="https://cli.vuejs.org" rel="noopener" target="_blank">vue-cli documentation</a>.
|
||||||
</p>
|
</p>
|
||||||
<h3>Installed CLI Plugins</h3>
|
<h3>Installed CLI Plugins</h3>
|
||||||
<ul>
|
<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-babel"
|
||||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
|
rel="noopener" target="_blank">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>
|
<li><a
|
||||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
|
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
|
||||||
|
rel="noopener" target="_blank">router</a></li>
|
||||||
|
<li><a
|
||||||
|
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
|
||||||
|
rel="noopener" target="_blank">eslint</a></li>
|
||||||
|
<li><a
|
||||||
|
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript"
|
||||||
|
rel="noopener" target="_blank">typescript</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<h3>Essential Links</h3>
|
<h3>Essential Links</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
|
<li><a href="https://vuejs.org" rel="noopener" target="_blank">Core Docs</a></li>
|
||||||
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
|
<li><a href="https://forum.vuejs.org" rel="noopener" target="_blank">Forum</a></li>
|
||||||
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
|
<li><a href="https://chat.vuejs.org" rel="noopener" target="_blank">Community Chat</a>
|
||||||
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
|
</li>
|
||||||
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
|
<li><a href="https://twitter.com/vuejs" rel="noopener" target="_blank">Twitter</a></li>
|
||||||
|
<li><a href="https://news.vuejs.org" rel="noopener" target="_blank">News</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<h3>Ecosystem</h3>
|
<h3>Ecosystem</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
|
<li><a href="https://router.vuejs.org" rel="noopener" target="_blank">vue-router</a>
|
||||||
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
|
</li>
|
||||||
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
|
<li><a href="https://vuex.vuejs.org" rel="noopener" target="_blank">vuex</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/vue-devtools#vue-devtools" rel="noopener"
|
||||||
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
|
target="_blank">vue-devtools</a></li>
|
||||||
|
<li><a href="https://vue-loader.vuejs.org" rel="noopener" target="_blank">vue-loader</a>
|
||||||
|
</li>
|
||||||
|
<li><a href="https://github.com/vuejs/awesome-vue" rel="noopener" target="_blank">awesome-vue</a>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -40,25 +52,33 @@ import { Options, Vue } from 'vue-class-component';
|
|||||||
msg: String
|
msg: String
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
export default class HelloWorld extends Vue {
|
export default class HelloWorld extends Vue
|
||||||
|
{
|
||||||
msg!: string
|
msg!: string
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
<style scoped lang="scss">
|
<style lang="scss" scoped>
|
||||||
h3 {
|
h3
|
||||||
|
{
|
||||||
margin: 40px 0 0;
|
margin: 40px 0 0;
|
||||||
}
|
}
|
||||||
ul {
|
|
||||||
|
ul
|
||||||
|
{
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
li {
|
|
||||||
|
li
|
||||||
|
{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin: 0 10px;
|
margin: 0 10px;
|
||||||
}
|
}
|
||||||
a {
|
|
||||||
|
a
|
||||||
|
{
|
||||||
color: #42b983;
|
color: #42b983;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Vendored
+2
-1
@@ -1,5 +1,6 @@
|
|||||||
/* eslint-disable */
|
/* eslint-disable */
|
||||||
declare module '*.vue' {
|
declare module '*.vue'
|
||||||
|
{
|
||||||
import type {DefineComponent} from 'vue'
|
import type {DefineComponent} from 'vue'
|
||||||
const component: DefineComponent<{}, {}, any>
|
const component: DefineComponent<{}, {}, any>
|
||||||
export default component
|
export default component
|
||||||
|
|||||||
+3
-1
@@ -14,5 +14,7 @@ import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
|
|||||||
HelloWorld,
|
HelloWorld,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
export default class Home extends Vue {}
|
export default class Home extends Vue
|
||||||
|
{
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user