没有路由,没有状态管理,没有css预处理器 只能写小demo用,做项目别想了
目录结构
new-vue
├── public
│ └── index.html
├── src
│ ├── app.vue
│ └── main.js
└── package.json
文件
- index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
</head>
<body>
<div id="app"></div>
</body>
</html>
- package.json
package-lock.json
自动生成
{
"name": "new-vue",
"version": "0.0.1",
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
},
"dependencies": {
"vue": "2.6.10"
},
"devDependencies": {
"@vue/cli-service": "3.5.3",
"vue-template-compiler": "2.6.10"
},
"engines": {
"node": ">=8.9",
"npm": ">= 3.0.0"
}
}
- main.js
import Vue from 'vue'
import App from './App'
new Vue({
el: '#app',
render: h => h(App)
})
- app.vue
<template>
<div id="app">
{{ title }}
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
title: '这个是标题156'
}
},
}
</script>
启动
npm install // 下载基础包
npm run serve // 启动项目
2020年11月10日