1、说明:
①、vue-cli是vue官方提供的脚手架工具
②、github地址: github.com/vuejs/vue-c…
③、作用:从github.com/vuejs-templ…
2、创建vue项目
npm install -g vue-cli
vue init webpack vue_demo #webpack是脚手架其中的一个模板
cd vue_demo
npm install
npm run dev
访问:http://localhost:8080/
注意:上图是因为,本地vue的脚手架已经下载过;若你的没有下载,记得先执行npm install -g vue-cli命令,再执行如下图的命令即可。
3、模板项目结构
说明:
①、build、config配置文件夹,里面是一些配置的文件
②、node_modules 组件的依赖项
③、src源码,在这里写相应的Vue组件
④、static 放一些全局的资源,如样式啊。
static/.gitkeep文件,给git进行服务的,有这个文件后,static文件及下的文件才能被git管理
⑤、.babelrc作用: ES6转ES5 jsx转js
⑥、.eslintrc.js eslint的配置;.eslintignore 可以配置eslint忽略的文件及文件夹
⑦、.gitignore git的忽略文件及文件夹
⑧、package.json 当前应用的描述文件
描述:一个Vue文件就是一个Vue的组件,把Vue需要的组件嵌入到HTML中。
Vue组件的模板如下:
<template>
<div> </div>
</template>
<script>
/* 向外默认暴露一个配置对象 */
export default{ }
</script>
<style>
</style>