Commit c64e52ab authored by shangbj's avatar shangbj

init

parents
# editorconfig.org
root = true
[*]
indent_size = 2
indent_style = space
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
module.exports = {
root: true,
env: {
browser: true,
node: true
},
parserOptions: {
parser: 'babel-eslint'
},
extends: [
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
'plugin:vue/essential'
],
// required to lint *.vue files
plugins: [
'vue'
],
// add your custom rules here
rules: {}
}
# dependencies
node_modules
# logs
npm-debug.log
# Nuxt build
.nuxt
# Nuxt generate
dist
# bjgee
> Nuxt.js project
## Build Setup
``` bash
# install dependencies
$ npm install # Or yarn install
# serve with hot reload at localhost:3000
$ npm run dev
# build for production and launch server
$ npm run build
$ npm start
# generate static project
$ npm run generate
```
For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).
# ASSETS
This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/assets#webpacked
**This directory is not required, you can delete it if you don't want to use it.**
<template>
<div class="VueToNuxtLogo">
<div class="Triangle Triangle--two"/>
<div class="Triangle Triangle--one"/>
<div class="Triangle Triangle--three"/>
<div class="Triangle Triangle--four"/>
</div>
</template>
<style>
.VueToNuxtLogo {
display: inline-block;
animation: turn 2s linear forwards 1s;
transform: rotateX(180deg);
position: relative;
overflow: hidden;
height: 180px;
width: 245px;
}
.Triangle {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
}
.Triangle--one {
border-left: 105px solid transparent;
border-right: 105px solid transparent;
border-bottom: 180px solid #41B883;
}
.Triangle--two {
top: 30px;
left: 35px;
animation: goright 0.5s linear forwards 3.5s;
border-left: 87.5px solid transparent;
border-right: 87.5px solid transparent;
border-bottom: 150px solid #3B8070;
}
.Triangle--three {
top: 60px;
left: 35px;
animation: goright 0.5s linear forwards 3.5s;
border-left: 70px solid transparent;
border-right: 70px solid transparent;
border-bottom: 120px solid #35495E;
}
.Triangle--four {
top: 120px;
left: 70px;
animation: godown 0.5s linear forwards 3s;
border-left: 35px solid transparent;
border-right: 35px solid transparent;
border-bottom: 60px solid #fff;
}
@keyframes turn {
100% {
transform: rotateX(0deg);
}
}
@keyframes godown {
100% {
top: 180px;
}
}
@keyframes goright {
100% {
left: 70px;
}
}
</style>
# COMPONENTS
The components directory contains your Vue.js Components.
Nuxt.js doesn't supercharge these components.
**This directory is not required, you can delete it if you don't want to use it.**
# LAYOUTS
This directory contains your Application Layouts.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/views#layouts
**This directory is not required, you can delete it if you don't want to use it.**
<template>
<div>
<nuxt/>
</div>
</template>
<style>
html {
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 16px;
word-spacing: 1px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: border-box;
margin: 0;
}
.button--green {
display: inline-block;
border-radius: 4px;
border: 1px solid #3b8070;
color: #3b8070;
text-decoration: none;
padding: 10px 30px;
}
.button--green:hover {
color: #fff;
background-color: #3b8070;
}
.button--grey {
display: inline-block;
border-radius: 4px;
border: 1px solid #35495e;
color: #35495e;
text-decoration: none;
padding: 10px 30px;
margin-left: 15px;
}
.button--grey:hover {
color: #fff;
background-color: #35495e;
}
</style>
<template>
<div class="container">
<h1 v-if="error.statusCode === '404'">页面不存在</h1>
<h1 v-else>错误页面</h1>
<nuxt-link to="/">返回首页</nuxt-link>
</div>
</template>
<script>
export default {
props:{
error:{
type:Object,
default: null
}
}
}
</script>
<style scoped>
.container{
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
padding-top: 10%;
text-align: center;
}
h1{
font-size: 20px;
}
</style>
# MIDDLEWARE
This directory contains your Application Middleware.
The middleware lets you define custom function to be ran before rendering a page or a group of pages (layouts).
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/routing#middleware
**This directory is not required, you can delete it if you don't want to use it.**
module.exports = {
/*
** Headers of the page
*/
head: {
title: 'bjgee',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: 'Nuxt.js project' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
]
},
css: [
'element-ui/lib/theme-chalk/index.css'
],
modules: [
'@nuxtjs/axios',
'@nuxtjs/proxy'
],
plugins:[
'@/plugins/element-ui',
],
// proxy: [
// ['/api', { target: 'https://dog.ceo/'}],
// ],
/*
** Customize the progress bar color
*/
loading: { color: '#3B8070' },
/*
** Build configuration
*/
build: {
vendor: [
'axios',/*多个地方引用,防止多次打包*/
// 'element-ui',
],
/*
** Run ESLint on save
*/
extend (config, { isDev, isClient }) {
if (isDev && isClient) {
config.module.rules.push({
enforce: 'pre',
test: /\.(js|vue)$/,
loader: 'eslint-loader',
exclude: /(node_modules)/
})
}
}
}
}
{
"name": "bjgee",
"version": "1.0.0",
"description": "Nuxt.js project",
"author": "shangbj <langrenaq@126.com>",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"
},
"dependencies": {
"@nuxtjs/axios": "^5.3.1",
"@nuxtjs/proxy": "^1.2.4",
"axios": "^0.18.0",
"element-ui": "^2.4.4",
"nuxt": "^1.0.0",
"vue-quill-editor": "^3.0.6"
},
"devDependencies": {
"babel-eslint": "^8.2.1",
"eslint": "^4.15.0",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^1.7.1",
"eslint-plugin-vue": "^4.0.0",
"sass-loader": "^7.0.3",
"node-sass": "^4.9.2"
}
}
# PAGES
This directory contains your Application Views and Routes.
The framework reads all the .vue files inside this directory and creates the router of your application.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/routing
<template>
<section class="container">
<div>
<app-logo/>
<h1 class="title">
bjgee
</h1>
<h2 class="subtitle">
Nuxt.js project
</h2>
<div class="links">
<a
href="https://nuxtjs.org/"
target="_blank"
class="button--green">Documentation</a>
<a
href="https://github.com/nuxt/nuxt.js"
target="_blank"
class="button--grey">GitHub</a>
</div>
</div>
</section>
</template>
<script>
import AppLogo from '~/components/AppLogo.vue'
export default {
components: {
AppLogo
}
}
</script>
<style>
.container {
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.title {
font-family: "Quicksand", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* 1 */
display: block;
font-weight: 300;
font-size: 100px;
color: #35495e;
letter-spacing: 1px;
}
.subtitle {
font-weight: 300;
font-size: 42px;
color: #526488;
word-spacing: 5px;
padding-bottom: 15px;
}
.links {
padding-top: 15px;
}
</style>
# PLUGINS
This directory contains your Javascript plugins that you want to run before instantiating the root vue.js application.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/plugins
**This directory is not required, you can delete it if you don't want to use it.**
import Vue from 'vue'
import Element from 'element-ui'
export default () => {
Vue.use(Element)
}
\ No newline at end of file
# STATIC
This directory contains your static files.
Each file inside this directory is mapped to /.
Example: /static/robots.txt is mapped as /robots.txt.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/assets#static
**This directory is not required, you can delete it if you don't want to use it.**
# STORE
This directory contains your Vuex Store files.
Vuex Store option is implemented in the Nuxt.js framework.
Creating a index.js file in this directory activate the option in the framework automatically.
More information about the usage of this directory in the documentation:
https://nuxtjs.org/guide/vuex-store
**This directory is not required, you can delete it if you don't want to use it.**
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment