mirror of
https://github.com/actix/examples
synced 2024-11-23 14:31:07 +01:00
update vue to v3
This commit is contained in:
Rob Ede
parent
60ecab2732
commit
9b2e24b1b3
8
.prettierrc.yml
Normal file
8
.prettierrc.yml
Normal file
@ -0,0 +1,8 @@
|
||||
singleQuote: true
|
||||
arrowParens: avoid
|
||||
semi: false
|
||||
overrides:
|
||||
- files: '*.md'
|
||||
options:
|
||||
printWidth: 9999
|
||||
proseWrap: never
|
||||
@ -14,7 +14,7 @@ In a separate terminal, also run:
|
||||
```sh
|
||||
cd cors/frontend
|
||||
npm install
|
||||
npm run serve
|
||||
npm run dev
|
||||
```
|
||||
|
||||
then open browser at: http://localhost:8080
|
||||
|
||||
18
cors/frontend/.gitignore
vendored
18
cors/frontend/.gitignore
vendored
@ -1,11 +1,18 @@
|
||||
.DS_Store
|
||||
node_modules/
|
||||
/dist/
|
||||
.cache
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
package-lock.json
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
@ -13,3 +20,4 @@ package-lock.json
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>webapp</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>CORS Example</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
1115
cors/frontend/package-lock.json
generated
Normal file
1115
cors/frontend/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,16 +1,17 @@
|
||||
{
|
||||
"name": "frontend-vue",
|
||||
"version": "0.1.0",
|
||||
"description": "webapp",
|
||||
"name": "actix-cors-example-ui",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build"
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "2.6.12"
|
||||
"vue": "^3.3.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-service": "^5.0.0",
|
||||
"vue-template-compiler": "^2.6.0"
|
||||
"@vitejs/plugin-vue": "^4.2.3",
|
||||
"vite": "^4.3.9"
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,14 +82,14 @@ export default {
|
||||
},
|
||||
method: 'POST',
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((json) => {
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log(json)
|
||||
this.email = json.email
|
||||
this.username = json.username
|
||||
this.password = json.password
|
||||
})
|
||||
.catch((e) => {
|
||||
.catch(e => {
|
||||
console.log(e)
|
||||
})
|
||||
},
|
||||
@ -103,6 +103,7 @@ export default {
|
||||
margin: 0 auto;
|
||||
padding-top: 33px;
|
||||
}
|
||||
|
||||
#title {
|
||||
padding: 0.5rem 0;
|
||||
font-size: 22px;
|
||||
@ -110,6 +111,7 @@ export default {
|
||||
background-color: bisque;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input[type='text'],
|
||||
input[type='password'] {
|
||||
margin: 6px auto auto;
|
||||
@ -119,6 +121,7 @@ input[type='password'] {
|
||||
border-bottom: 1px solid #aaa;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#submit {
|
||||
margin: 10px 0 20px 0;
|
||||
width: 250px;
|
||||
@ -131,14 +134,17 @@ input[type='password'] {
|
||||
transition: 0.1s ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type='checkbox'] {
|
||||
margin-top: 11px;
|
||||
}
|
||||
|
||||
dialog {
|
||||
top: 50%;
|
||||
width: 80%;
|
||||
border: 5px solid rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
dialog::backdrop {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@ -147,6 +153,7 @@ dialog::backdrop {
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
#closeDialog {
|
||||
display: inline-block;
|
||||
border-radius: 3px;
|
||||
@ -159,16 +166,19 @@ dialog::backdrop {
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#closeDialog:hover,
|
||||
#closeDialog:focus {
|
||||
opacity: 0.92;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#user-info {
|
||||
width: 250px;
|
||||
margin: 0 auto;
|
||||
padding-top: 44px;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 600px) {
|
||||
#content {
|
||||
margin: 0 auto;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import Vue from 'vue'
|
||||
import App from './app'
|
||||
// import './assets/main.css'
|
||||
|
||||
new Vue({
|
||||
render: h => h(App)
|
||||
}).$mount('#app')
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
createApp(App).mount('#app')
|
||||
|
||||
16
cors/frontend/vite.config.js
Normal file
16
cors/frontend/vite.config.js
Normal file
@ -0,0 +1,16 @@
|
||||
import { fileURLToPath, URL } from 'node:url'
|
||||
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
}
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user