Vue learning-build environment

First I used Hbuilder to run through the first Vue project

Steps:
1. Create a new Vue project
Insert picture description here
2. Vue project . After creation, right-click on the newly created project to create an index.html file
Insert picture description here
3. On the Vue official website, download a Vue.js file and place it in Create a Vue project, under the src package, easy to use Insert picture description here
4. Write the first Vue code

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Hello vue</title>
		
		<script src="./src/vue.js" type="text/javascript" charset="UTF-8"></script> 
		<!-- 引入vue.js  要不然无法运行-->
	</head>
	<body>
		
		<div id="demo">
			{
    
    {
    
    message}}
			
		</div>
		
	<script type="text/javascript">
		
		var demo=new Vue(
		{
    
    
			el:'#demo',
			data:{
    
    
				message:'hello vue!!!'
			}
			
		}
		
		);
		
	</script>
	
	</body>
</html>

Save, then run.

Insert picture description here


Ran through! ! !

Guess you like

Origin blog.csdn.net/fxwentian/article/details/114305668