<!-- 简单写个title和一个循环 -->
<template>
div id="example">
h1>{{ msg }}</ul>
li v-for="n in 5">{{ n }}lidiv>
>
script>
export default {
data () {
return {
msg: 'Hello World!
}
}
}
style scoped
#example {
background: red;
height 100vh;
}
style>
/* 引入vue和主页 */
import Vue from 'vue'
import App from './App.vue'
/* 实例化一个vue */
new Vue({
el: '#app',render: h => h(App)
})
/* 引入操作路径模块和webpack */
var path = require('path');
var webpack = require('webpack');
module.exports = {
输入文件 */
entry: './src/main.js',output: {
输出目录，没有则新建
path: path.resolve(__dirname,'./dist'), 静态目录，可以直接从这里取文件
publicPath: '/dist/' 文件名
filename: 'build.js'
},module: {
rules: [
用来解析vue后缀的文件
{
test: /\.vue$/
},1)"> 用babel来解析js文件并把es6的语法转换成浏览器认识的语法
{
test: /\.js$/ 排除模块安装目录的文件
exclude: /node_modules/
}
]
}
}
<!doctype htmlhtmlheadmeta charset="utf-8"name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0,minimum-scale=1.0,maximum-scale=1.0"title>vue-webpackbodysection ="app"></sectionscript src="./dist/build.js">
服务热线 19970861797
