├── .gitignore
├── README.md
├── babel.config.js
├── css
└── main.css
├── package-lock.json
├── package.json
├── public
├── favicon.ico
└── index.html
├── src
├── App.vue
├── assets
│ └── logo.png
├── components
│ ├── HelloWorld.vue
│ └── test_code.vue
└── main.js
├── vue.config.js
└── yarn.lock
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | /dist
4 |
5 | # local env files
6 | .env.local
7 | .env.*.local
8 |
9 | # Log files
10 | npm-debug.log*
11 | yarn-debug.log*
12 | yarn-error.log*
13 |
14 | # Editor directories and files
15 | .idea
16 | .vscode
17 | *.suo
18 | *.ntvs*
19 | *.njsproj
20 | *.sln
21 | *.sw*
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 启动命令
2 |
3 | yarn
4 |
5 | yarn serve
6 |
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: [
3 | '@vue/app'
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/css/main.css:
--------------------------------------------------------------------------------
1 | h3[data-v-b9167eee]{margin:40px 0 0}ul[data-v-b9167eee]{list-style-type:none;padding:0}li[data-v-b9167eee]{display:inline-block;margin:0 10px}a[data-v-b9167eee]{color:#42b983}#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}
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vue3",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "serve": "vue-cli-service serve",
7 | "build": "vue-cli-service build",
8 | "lint": "vue-cli-service lint"
9 | },
10 | "dependencies": {
11 | "vue": "^2.5.22"
12 | },
13 | "devDependencies": {
14 | "@vue/cli-plugin-babel": "^3.4.0",
15 | "@vue/cli-plugin-eslint": "^3.4.0",
16 | "@vue/cli-service": "^3.4.0",
17 | "babel-eslint": "^10.0.1",
18 | "eslint": "^5.8.0",
19 | "eslint-plugin-vue": "^5.0.0",
20 | "mini-css-extract-plugin": "^0.5.0",
21 | "vue-template-compiler": "^2.5.21"
22 | },
23 | "eslintConfig": {
24 | "root": true,
25 | "env": {
26 | "node": true
27 | },
28 | "extends": [
29 | "plugin:vue/essential",
30 | "eslint:recommended"
31 | ],
32 | "rules": {},
33 | "parserOptions": {
34 | "parser": "babel-eslint"
35 | }
36 | },
37 | "postcss": {
38 | "plugins": {
39 | "autoprefixer": {}
40 | }
41 | },
42 | "browserslist": [
43 | "> 1%",
44 | "last 2 versions",
45 | "not ie <= 8"
46 | ]
47 | }
48 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/SunshineMibai/vue_test_code/f92b4e7bf5aea485d86f754f566eb5b5cb8c7884/public/favicon.ico
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | vue3
9 |
10 |
11 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/src/App.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
3 |
4 |
5 |
6 |
7 |
{{testSend}}
8 |
9 |
3 |
8 |
9 |
10 |
11 |
112 |
--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import App from './App.vue'
3 |
4 | Vue.config.productionTip = false
5 |
6 | new Vue({
7 | render: h => h(App),
8 | }).$mount('#app')
9 |
--------------------------------------------------------------------------------
/vue.config.js:
--------------------------------------------------------------------------------
1 |
2 | let path = require('path')
3 | let MiniCssExtractPlugin = require('mini-css-extract-plugin')
4 |
5 |
6 |
7 | module.exports = {
8 | devServer:{
9 | port:3000,
10 | hot:true
11 | },
12 | outputDir:'./dist',
13 | configureWebpack: {
14 | plugins: [
15 | new MiniCssExtractPlugin({
16 | filename:'../css/main.css' //css的输出路径
17 | })
18 | ]
19 | },
20 |
21 | }
--------------------------------------------------------------------------------