striveCode icon indicating copy to clipboard operation
striveCode copied to clipboard

vue-cli3简单使用

Open itstrive opened this issue 7 years ago • 0 comments

vue-cli3相比vue-cli2之前的版本更改算是比较大的。

官方所说的 "快速原型开发"

简单说,就是单纯一个 .vue文件或者.js文件开发(肯定可以引入其他组件),最后build成一个普通的页面。

用途: 公司的专题页开发、或者简单页面的开发(理论上也可以开发任何项目)

比如一个简单的测试: 创建一个 App.vue, 然后 运行 vue serve -o

<template>
	<div>
		<h1 @click="changeA">{{a}}!</h1>
		<h3>welcome</h3>
		<B></B>
	</div>
</template>

<style>
	h3{
		color: red;
	}
</style>

<script>
	import B from './B'
	export default {
		components:{
			B
		},
		data(){
			return {
				a:456,
			}
		},
		methods:{
			changeA(){
				this.a = Date.now();
			}
		}
	}
</script>

特别注意: 使用中下载包一定要用 npm,不要用 cnpm,要不热更新会失效 (时间截止到 2018-8-22之前cnpm热更新都失效的)。所以一定要注意。

  • 最后vue build,就和之前一样.

  • 更多查看: https://cli.vuejs.org/zh/guide/prototyping.html


itstrive avatar Aug 22 '18 08:08 itstrive