项目搭建
2021-04-02 10:53:39 35 举报
AI智能生成
项目搭建
作者其他创作
大纲/内容
1. 脚手架
vue-cli是vue官方提供用于搭建基于vue+webpack+es6项目的脚手架工具
官方文档
https://www.npmjs.com/package/vue-cli
基本步骤
npm install -g vue-cli
vue init webpack lkpdd
cd lkpdd
npm install
npm run dev
运行: localhost:8080
2. 项目初始化结构
分支主题
3. 编译和打包
开发环境运行
npm run dev (自动编译打包)
在内存中对拼多多项目进行编译和打包
http://localhost:8080/#/
生产环境打包运行
npm i serve -g --save
服务器运行命令
npm run build
serve dist
http://localhost:5000/#/
4. 项目目录结构设计
分支主题
5. CSS预编译器选择
1. 主流的三种预编译器
Less
Sass
Stylus
概念
富有表现力的、动态的、健壮的CSS
参考手册
https://www.zhangxinxu.com/jq/stylus/
快速上手
2. 安装stylus依赖包
npm i stylus stylus-loader --save-dev
3. 如何使用
<style scoped lang="stylus" ref="stylesheet/stylus"></style>
在模板中配置
分支主题
4. 配置默认的初始化样式文件
/common/stylus/mixins.styl
/static/css/reset.css
http://meyerweb.com/eric/tools/css/reset/
全局引入
index.html
6. 移动端项目必须配置
1. 视口(viewport)
2. 点击响应延迟3毫秒
原因
这是为了检查用户是否在做双击。为了能够立即响应用户的点击事件,才有了FastClick。
使用
地址
引用和配置
0 条评论
下一页