Vue脚手架搭建过程
1.使用npm全局安装vue-cli(前提是你已经安装了nodejs,否则你连npm都用不了),在cmd中输入一下命令
npm install --global vue-cli
安装完成后,创建自己的工作空间,在cmd切换至刚刚创建好的工作空间,如果已经有工作空间,直接切换到工作空间即可。使用命令创建项目
vue init webpack vuetest
Test是项目名称,这个名字自己随便取。
命令输入后,会进入安装阶段,需要用户输入一些信息
Project name (vuetest) 项目名称,可以自己指定,也可直接回车,按照括号中默认名字(注意这里的名字不能有大写字母,如果有会报错Sorry, name can no longer contain capital letters),阮一峰老师博客为什么文件名要小写 ,可以参考一下。
Project description (A Vue.js project) 项目描述,也可直接点击回车,使用默认名字
Author (........) 作者,自己输吧
接下来会让用户选择
Runtime + Compiler: recommended for most users 运行加编译,既然已经说了推荐,就选它了
Runtime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render functions are required elsewhere 仅运行时,已经有推荐了就选择第一个了
Install vue-router? (Y/n) 是否安装vue-router,这是官方的路由,我选了n。
Use ESLint to lint your code? (Y/n) 是否使用ESLint管理代码,ESLint是个代码风格管理工具,是用来统一代码风格的,并不会影响整体的运行,这也是为了多人协作,新手就不用了,一般项目中都会使用。ESLint官网
Setup unit tests with Karma + Mocha? (Y/n) 是否安装单元测试,我选择n
Setup e2e tests with Nightwatch(Y/n)? 是否安装e2e测试 ,我选择n
完成
简单说一下目录,
bulid 里面是一些操作文件,使用npm run * 时其实执行的就是这里的文件
config 配置文件,执行文件需要的配置信息
src 资源文件,所有的组件以及所用的图片都是在这个放着的简单看一下这个文件夹下都放了那些东西
assets 资源文件夹,放图片之类的资源,components 组件文件夹,写的所有组件都放在这个文件夹下,现在有一个写好的组件已经放到里面了,router 路由文件夹,这个决定了也面的跳转规则,App.vue应用组件,所有自己写的组件,都是在这个组件之上运行了,main.js webpack入口文件,webpack四大特性entry入口、output输出,loader加载器,plugins插件,可以再项目中build\webpack.base.conf.js第12行看到这个入口文件是哪个。
切换到项目目录
cd vuetest
安装一来模块
npm install
项目构建完成,输入npm run dev运行项目
最新文章
- Web报表工具FineReport的JS API开发(二)
- 07_编写天气预报和手机归属地的WebService
- OC之NSString、NSMutableString学习笔记 常用方法
- RabbitMQ用户角色及权限控制
- 进程外session(session保存在sqlserver)
- 申请免费的SSL证书(Win7,PowerShell,Let's Encrypt)
- uoj#179 线性规划
- UnitOfWork知多少
- iOS 11 导航栏 item 偏移问题 和 Swift 下 UIButton 设置 title、image 显示问题
- Python爬虫的步骤和工具
- 数值计算 的bug:(理论)数学上等价,实际运行未必等价
- 在Vue框架中使用百度地图
- linux 的基本操作(编写shell 脚本)
- 解决hash冲突的三个方法(转)
- Cmake 编译opengl开源库glfw工程及使用
- Locust 基本使用
- 【转】C#中的委托,匿名方法和Lambda表达式
- Java Web基础——Action+Service +Dao三层的功能划分 (转载)
- .NET之特性和属性(转)
- python3-开发进阶Django-debug-toolbar的配置和Django logging的配置
热门文章
- Python-GUI编程-PyQt5
- RBAC权限控制
- quartz(4)--quartz.properties文件
- Java中遍历map的四种方法 - 转载
- geoserver源码maven编译相关问题
- Dynamo论文介绍
- Java 各种锁的小结
- Robot Framework(一)
- js图片倒计时
- [6644] 02 Apr 23:11:58.976 # Creating Server TCP listening socket *:6379: bind: No such file or directory