Vue项目脚手架搭建

安装淘宝镜像就是为了快速的安装npm包。(网速不好的建议使用)

 全局安装

npm install -g cnpm --registry=https://registry.npm.taobao.org 

 安装脚手架

cnpm install vue-cli 

 创建项目

vue init webpack myapp
? Project name myapp  (起项目名字)
? Project description A Vue.js project  (描述Vue.js项目)
? Author  (作者)
? Vue build   (Vue构建)--standalone
? Install vue-router?   (是否安装vue-router)--Yes
? Use ESLint to lint your code?   (是否使用ESLint来验证我们的语法)--Yes
? Pick an ESLint preset (使用哪种语法规范来检查我们的代码)--standard
选项有三个
  1.standard(https://github.com/feross/standard) js的标准风格
  2.Airbnb(https://github.com/airbnb/javascript) JavaScript最合理的方法,这个github地址说是JavaScript最合理的方法
  3.none (configure it yourself) 自己配置
? Set up unit tests   (是否安装单元测试) --Yes
? Pick a test runner  (选择一个单元测试运行器) --karma
选项有三个
  1.Jest(Jest是由Facebook发布的开源的、基于Jasmine的JavaScript单元测试框架)
  2.Karma and Mocha
  3.none
? Setup e2e tests with Nightwatch?  (是否安装E2E测试框架NightWatch (e2e,也就是End To End,就是所谓的“用户真实场景”)--Yes
? Should we run `npm install` for you after the project has been created? (recommended)
(译:项目创建后是否要为你运行“npm install”?这里选择包管理工具) --no
选项有三个
  yes,use npm(使用npm)
  yes,use yarn(使用yarn)
  no,I will handle that myself(自己操作)

--是作者自己本人的操作

安装依赖并且运行   

cd myapp

cnpm run dev

显示以上说明启动成功 根据http://localhost:8080 就能进入你的vue项目了!!!!

熟悉项目文件

build ---  项目的配置文件(项目打包、版本检测、工具、webpack的配置- 基础配置、开发配置、生产配置、测试配置)              
build/webpack.base.conf.js    (43行关闭语法校验)
config -- 基于webpack的选项的抽离配置
node_modules -- 安装的依赖
src --- 项目开发的主场
static -- 代码带包会給其内部添加css文件和js文件
test --- 测试的代码
.babelrc -- 高级js的预设文件
.editorconfig -- 编辑器配置文件
.eslintignore -- 验证代码的忽略文件 --- 哪些文件不需要去验证代码 添加/node_modules/
eslintrc.js -- 验证配置文件
.gitignore -- 使用git上传时的忽略文件
.postcssrc.js -- css的一些配置
index.html --- 首页面
package.json --- 项目的描述文件
README.md

熟悉src文件

 assets      -------   放置静态资源文件
 components  -------   自定义的组件
 router      -------   路由
 App.vue     -------   最大的那个组件
 main.js     -------   入口文件

熟悉build文件

config/index.js (13行配置代理服务器解决跨域问题)

安装axios

npm install axios

安装Sass

npm install vue-loader --save-dev
npm install sass-loader node-sass --save-dev

安装Vuex

npm install vuex --save

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值