在学习了Html，js，css和Vue的基础知识后，自以为能去开发项目了。可是当去搞时发现万事开头难！各种安装和配置。其实很多东西开始时倒真的不必太在意。做好第一步——新建并启动一个Vue项目，就达成基本目标了。我们可以使用Vue-cli脚手架进行创建Vue项目,可以达到事半功倍的效果。
说明
1) vue-cli
是
vue
官方提供的脚手架工具
2) github: https://github.com/vuejs/vue-cli
3)
作用
:
从
https://github.com/vuejs-templates
下载模板项目
创建
vue
项目
命令行中输入一下命令
npm install -g vue-cli
vue init webpack vue_demo
cd vue_demo
npm install
npm run dev
访问
: http://localhost:8080/
模板项目的结构
|-- build : webpack
相关的配置文件夹
(
基本不需要修改
)
|-- dev-server.js :
通过
express
启动后台服务器
|-- config: webpack
相关的配置文件夹
(
基本不需要修改
)
|-- index.js:
指定的后台服务的端口号和静态资源文件夹
|-- node_modules
|-- src :
源码文件夹
|-- components: vue
组件及其相关资源文件夹
|-- App.vue:
应用根主组件
|-- main.js:
应用入口
js
|-- static:
静态资源文件夹
|-- .babelrc: babel
的配置文件
|-- .eslintignore: eslint
检查忽略的配置
|-- .eslintrc.js: eslint
检查的配置
|-- .gitignore: git
版本管制忽略的配置
|-- index.html:
主页面文件
|-- package.json:
应用包配置文件
|-- README.md:
应用描述说明的
readme
文件