在webpack中使用vue定义.vue组件（通过render）

第一步： 安装依赖包

1.通过npm下载vue包；
2.webpack无法直接解析.vue文件，需要安装vue-loader，vue-template-compiler；

npm i vue -S
npm i vue-loader vue-template-compiler -D

3.安装以后还需要在webpack.config.js配置文件中添加rule， 对vue文件的处理规则，否则webpack无法处理vue文件。

module: {
		rules: [
			{ test: /\.vue$/, use: 'vue-loader'} 
		]
	}

第二步：创建login.vue组件

<template>
	<div>
		<h2>这是通过.vue单文件定义的组件</h2>
	</div>
</template>

<script>
</script>

<style>
</style>

第三步：在入口文件中定义vue实例，并注册组件

用render函数处理login组件

//先引入vue和.vue组件
import Vue from 'vue'
import login from './login.vue'

const vm = new Vue({
	el: '#app',
	data: { },
	render: c => c(login)
		//这里是简写形式，完整版应该是
		// function  (createElements) {
		//	return createElements(login)
		//}	
})

大功告成！