重构项目,使用Vite+Ts
parent
f6650092ab
commit
24b6febc15
@ -0,0 +1,14 @@
|
||||
{
|
||||
"0 debug pnpm:scope": {
|
||||
"selected": 1
|
||||
},
|
||||
"1 error pnpm": {
|
||||
"code": "ERR_PNPM_NO_SCRIPT",
|
||||
"err": {
|
||||
"name": "pnpm",
|
||||
"message": "Missing script: install",
|
||||
"code": "ERR_PNPM_NO_SCRIPT",
|
||||
"stack": "pnpm: Missing script: install\n at Object.handler (D:\\softwares\\Program Files\\nodejs\\node_global\\node_modules\\pnpm\\dist\\pnpm.cjs:176134:15)\n at async D:\\softwares\\Program Files\\nodejs\\node_global\\node_modules\\pnpm\\dist\\pnpm.cjs:180328:21\n at async run (D:\\softwares\\Program Files\\nodejs\\node_global\\node_modules\\pnpm\\dist\\pnpm.cjs:180302:34)\n at async runPnpm (D:\\softwares\\Program Files\\nodejs\\node_global\\node_modules\\pnpm\\dist\\pnpm.cjs:180513:5)\n at async D:\\softwares\\Program Files\\nodejs\\node_global\\node_modules\\pnpm\\dist\\pnpm.cjs:180505:7"
|
||||
}
|
||||
}
|
||||
}
|
@ -1,2 +1,2 @@
|
||||
# PeterAlbus_Blog
|
||||
My personal blog based on vue.
|
||||
use Vite+Vue+Ts+ElementPlus
|
||||
|
@ -0,0 +1,6 @@
|
||||
// Generated by 'unplugin-auto-import'
|
||||
// We suggest you to commit this file into source control
|
||||
declare global {
|
||||
|
||||
}
|
||||
export {}
|
@ -0,0 +1,28 @@
|
||||
// generated by unplugin-vue-components
|
||||
// We suggest you to commit this file into source control
|
||||
// Read more: https://github.com/vuejs/vue-next/pull/3399
|
||||
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
ElAvatar: typeof import('element-plus/es')['ElAvatar']
|
||||
ElButton: typeof import('element-plus/es')['ElButton']
|
||||
ElCard: typeof import('element-plus/es')['ElCard']
|
||||
ElCol: typeof import('element-plus/es')['ElCol']
|
||||
ElForm: typeof import('element-plus/es')['ElForm']
|
||||
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
||||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||
ElImage: typeof import('element-plus/es')['ElImage']
|
||||
ElInput: typeof import('element-plus/es')['ElInput']
|
||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
|
||||
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
||||
ElRow: typeof import('element-plus/es')['ElRow']
|
||||
ElTag: typeof import('element-plus/es')['ElTag']
|
||||
ElTooltip: typeof import('element-plus/es')['ElTooltip']
|
||||
ElUpload: typeof import('element-plus/es')['ElUpload']
|
||||
Footer: typeof import('./src/components/Footer.vue')['default']
|
||||
TopNavBar: typeof import('./src/components/TopNavBar.vue')['default']
|
||||
}
|
||||
}
|
||||
|
||||
export { }
|
@ -0,0 +1,16 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta data-n-head="1" data-hid="description" name="description" content="">
|
||||
<meta data-n-head="1" data-hid="keywords" name="keywords" content="">
|
||||
<title>PeterAlbus的博客</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
File diff suppressed because it is too large
Load Diff
@ -1,37 +1,35 @@
|
||||
{
|
||||
"name": "peteralbus_blog",
|
||||
"version": "0.1.0",
|
||||
"name": "vite-peteralbus-blog",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build"
|
||||
"dev": "vite --host",
|
||||
"build": "vue-tsc --noEmit && vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@kangc/v-md-editor": "^2.3.6",
|
||||
"axios": "^0.21.1",
|
||||
"element-plus": "^1.1.0-beta.9",
|
||||
"@element-plus/icons-vue": "^1.1.3",
|
||||
"@kangc/v-md-editor": "^2.3.14",
|
||||
"@types/lodash-es": "^4.17.6",
|
||||
"@types/qs": "^6.9.7",
|
||||
"axios": "^0.26.1",
|
||||
"element-plus": "^2.1.4",
|
||||
"font-awesome": "^4.7.0",
|
||||
"highlight.js": "^11.1.0",
|
||||
"mavon-editor": "^2.9.1",
|
||||
"prismjs": "^1.24.1",
|
||||
"qs": "^6.5.2",
|
||||
"vue": "^3.2.28",
|
||||
"vue-axios": "^3.2.4",
|
||||
"vue-router": "^4.0.0-0",
|
||||
"vue3-social-share": "^0.1.3",
|
||||
"vuex": "^4.0.0-0"
|
||||
"prismjs": "^1.27.0",
|
||||
"qs": "^6.10.3",
|
||||
"vue": "^3.2.25",
|
||||
"vue-axios": "^3.4.1",
|
||||
"vue-router": "^4.0.14",
|
||||
"vue3-social-share": "0.1.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-router": "~4.5.0",
|
||||
"@vue/cli-plugin-vuex": "~4.5.0",
|
||||
"@vue/cli-service": "~4.5.0",
|
||||
"@vue/compiler-sfc": "^3.0.0",
|
||||
"sass": "^1.26.5",
|
||||
"sass-loader": "^8.0.2"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not dead"
|
||||
]
|
||||
"@vitejs/plugin-vue": "^2.2.0",
|
||||
"sass": "^1.49.9",
|
||||
"sass-loader": "^12.6.0",
|
||||
"typescript": "^4.5.4",
|
||||
"unplugin-auto-import": "^0.6.6",
|
||||
"unplugin-vue-components": "^0.18.3",
|
||||
"vite": "^2.8.0",
|
||||
"vue-tsc": "^0.29.8"
|
||||
}
|
||||
}
|
||||
|
File diff suppressed because it is too large
Load Diff
Binary file not shown.
After Width: | Height: | Size: 135 KiB |
Binary file not shown.
After Width: | Height: | Size: 1.3 MiB |
@ -1,19 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<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 data-n-head="1" data-hid="description" name="description" content="">
|
||||
<meta data-n-head="1" data-hid="keywords" name="keywords" content="">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title>PeterAlbus的博客</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,12 @@
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
declare module '*.vue' {
|
||||
import type { DefineComponent } from 'vue'
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
||||
|
||||
declare module '@kangc/v-md-editor'
|
||||
declare module '@kangc/v-md-editor/lib/theme/vuepress'
|
||||
declare module 'prismjs'
|
@ -1,139 +0,0 @@
|
||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
const Home=()=>import('../views/Home')
|
||||
const Blog=()=>import('../views/Blog')
|
||||
const Photo=()=>import('../views/Photo')
|
||||
const Types=()=>import('../views/Types')
|
||||
const About=()=>import('../views/About')
|
||||
const Document=()=>import('../views/Document')
|
||||
const EditBlog=()=>import('../views/EditBlog')
|
||||
const UploadPhoto=()=>import('../views/UploadPhoto')
|
||||
const AddFriendLink=()=>import('../views/AddFriendLink')
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'Home',
|
||||
component: Home,
|
||||
meta:{
|
||||
title:'主页——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客主页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/blog',
|
||||
name: 'Blog',
|
||||
component: Blog,
|
||||
meta:{
|
||||
title:'博文——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客博文页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/about',
|
||||
name: 'About',
|
||||
component: About,
|
||||
meta:{
|
||||
title:'关于我——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的个人介绍'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/document',
|
||||
name: 'Document',
|
||||
component: Document,
|
||||
meta:{
|
||||
title:'归档——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客归档页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/photo',
|
||||
name: 'Photo',
|
||||
component: Photo,
|
||||
meta:{
|
||||
title:'照片墙——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的照片墙'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/types',
|
||||
name: 'Types',
|
||||
component: Types,
|
||||
meta:{
|
||||
title:'分类查看——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客列表'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/editBlog',
|
||||
name: 'EditBlog',
|
||||
component: EditBlog,
|
||||
meta:{
|
||||
title:'编辑/创建博客——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客编辑页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/uploadPhoto',
|
||||
name: 'UploadPhoto',
|
||||
component: UploadPhoto,
|
||||
meta:{
|
||||
title:'上传照片——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/addFriendLink',
|
||||
name: 'AddFriendLink',
|
||||
component: AddFriendLink,
|
||||
meta:{
|
||||
title:'添加友情链接——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes
|
||||
})
|
||||
|
||||
router.beforeEach((to, from, next)=>{
|
||||
if(to.meta.content) { //路由发生变化时候修改meta中的content
|
||||
document.querySelector('meta[name="keywords"]').setAttribute('content',to.meta.content.keywords)
|
||||
document.querySelector('meta[name="description"]').setAttribute('content',to.meta.content.description)
|
||||
}
|
||||
if(to.meta.title) { //路由发生变化时候修改页面中的title
|
||||
document.title = to.meta.title
|
||||
}
|
||||
next()
|
||||
})
|
||||
|
||||
export default router
|
@ -0,0 +1,142 @@
|
||||
import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
|
||||
const Home=()=>import('../views/Home.vue')
|
||||
const Blog=()=>import('../views/Blog.vue')
|
||||
const Photo=()=>import('../views/Photo.vue')
|
||||
const Types=()=>import('../views/Types.vue')
|
||||
const About=()=>import('../views/About.vue')
|
||||
const Document=()=>import('../views/Document.vue')
|
||||
const EditBlog=()=>import('../views/EditBlog.vue')
|
||||
const UploadPhoto=()=>import('../views/UploadPhoto.vue')
|
||||
const AddFriendLink=()=>import('../views/AddFriendLink.vue')
|
||||
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'Home',
|
||||
component: Home,
|
||||
meta:{
|
||||
title:'主页——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客主页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/blog',
|
||||
name: 'Blog',
|
||||
component: Blog,
|
||||
meta:{
|
||||
title:'博文——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客博文页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/about',
|
||||
name: 'About',
|
||||
component: About,
|
||||
meta:{
|
||||
title:'关于我——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的个人介绍'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/document',
|
||||
name: 'Document',
|
||||
component: Document,
|
||||
meta:{
|
||||
title:'归档——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客归档页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/photo',
|
||||
name: 'Photo',
|
||||
component: Photo,
|
||||
meta:{
|
||||
title:'照片墙——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的照片墙'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/types',
|
||||
name: 'Types',
|
||||
component: Types,
|
||||
meta:{
|
||||
title:'分类查看——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客列表'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/editBlog',
|
||||
name: 'EditBlog',
|
||||
component: EditBlog,
|
||||
meta:{
|
||||
title:'编辑/创建博客——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客编辑页'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/uploadPhoto',
|
||||
name: 'UploadPhoto',
|
||||
component: UploadPhoto,
|
||||
meta:{
|
||||
title:'上传照片——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/addFriendLink',
|
||||
name: 'AddFriendLink',
|
||||
component: AddFriendLink,
|
||||
meta:{
|
||||
title:'添加友情链接——PeterAlbus的博客',
|
||||
content:{
|
||||
keywords:'PeterAlbus,Vue',
|
||||
description:'PeterAlbus的博客'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes
|
||||
})
|
||||
|
||||
// router.beforeEach((to, from, next)=>{
|
||||
// if(to.meta.content) {
|
||||
// // @ts-ignore
|
||||
// document.querySelector('meta[name="keywords"]').setAttribute('content',to.meta.content.keywords)
|
||||
// // @ts-ignore
|
||||
// document.querySelector('meta[name="description"]').setAttribute('content',to.meta.content.description)
|
||||
// }
|
||||
// if(to.meta.title) {
|
||||
// // @ts-ignore
|
||||
// document.title = to.meta.title
|
||||
// }
|
||||
// next()
|
||||
// })
|
||||
|
||||
export default router
|
@ -1,12 +0,0 @@
|
||||
import { createStore } from 'vuex'
|
||||
|
||||
export default createStore({
|
||||
state: {
|
||||
},
|
||||
mutations: {
|
||||
},
|
||||
actions: {
|
||||
},
|
||||
modules: {
|
||||
}
|
||||
})
|
@ -0,0 +1,22 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"sourceMap": true,
|
||||
"resolveJsonModule": true,
|
||||
"esModuleInterop": true,
|
||||
"lib": ["esnext", "dom"],
|
||||
"types": ["element-plus/global"],
|
||||
"skipLibCheck": true, // 针对element-puls的ts打包校验
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*":["src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
@ -0,0 +1,8 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node"
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
@ -0,0 +1,29 @@
|
||||
import {defineConfig} from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import AutoImport from 'unplugin-auto-import/vite'
|
||||
import Components from 'unplugin-vue-components/vite'
|
||||
import {ElementPlusResolver} from 'unplugin-vue-components/resolvers'
|
||||
import * as Path from 'path'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig(({command, mode}) => {
|
||||
return {
|
||||
plugins: [
|
||||
vue(),
|
||||
AutoImport({
|
||||
resolvers: [ElementPlusResolver()],
|
||||
}),
|
||||
Components({
|
||||
resolvers: [ElementPlusResolver()],
|
||||
}),
|
||||
],
|
||||
resolve:{
|
||||
alias:{
|
||||
'@':Path.resolve('src'),
|
||||
}
|
||||
},
|
||||
server: {
|
||||
port: 80
|
||||
}
|
||||
}
|
||||
})
|
@ -1,7 +0,0 @@
|
||||
module.exports = {
|
||||
devServer: {
|
||||
port: 80, //修改服务端口号
|
||||
|
||||
public: require('os').networkInterfaces()[Object.keys(require('os').networkInterfaces())[0]][1].address + ':80',
|
||||
},
|
||||
}
|
Loading…
Reference in New Issue