vue移动音乐app开发学习(一):环境搭建
本系列文章是为了记录学习中的知识点,便于后期自己观看。如果有需要的同学请登录慕课网,找到Vue 2.0 高级实战-开发移动端音乐WebApp进行观看,传送门。
一:使用vue-cli脚手架搭建:
1:为了确保你的node版本在4.*以上,输入 node -v 查看本机node版本,低于4请更新。
2:输入: npm install -g vue-cli 安装vue-cli脚手架。
3:输入: vue init webpack sell 安装项目模板,这里的sell是你模板文件的名字,可自定义。
4:安装完后会需要你填写一些东西,跟着图片下的内容填就行了
5:输入: cd sell 返回包的根目录
npm install 安装依赖
npm run dev 运行
二:相关配置:
1、相关依赖的配置:在package.json中的“dependencies”下,加入以下代码,然后执行npm instal
"stylus": "^0.54.5",
"stylus-loader": "^2.1.1",
"babel-runtime": "^6.0.0", //转义es语法
"fastclick": "^1.0.6" //解决移动端的300ms点击延迟
在devDependencies下加入以下代码
"babel-polyfill": "^6.2.0" //es6 api的如promise的转义
2、eslint规则的修改(可忽略):在eslintrc.js中的rules对象加入以下两行。如果需要忽略其他的规则,请查看eslint官网
'eol-last': 0, // 不检测文件末尾的空行
'space-before-function-paren':0 // 不检测函数左括号前的空格
3、公共的路径配置:修改webpack.base.conf.js
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'src': resolve('src'),
'common': resolve('src/common'),
'components': resolve('src/components')
}
}
在alias对象下我们可以定义路径的变量,原理是调用了resolve()这个方法:
function resolve (dir) {
return path.join(__dirname, '..', dir)
}
在resolve()方法中,我们直接将路径传入方法中,返回一个拼接好的路径
vue移动音乐app开发学习(一):环境搭建的更多相关文章
- vue移动音乐app开发学习(二):页面骨架的开发
本系列文章是为了记录学习中的知识点,便于后期自己观看.如果有需要的同学请登录慕课网,找到Vue 2.0 高级实战-开发移动端音乐WebApp进行观看,传送门. 完成后的页面状态以及项目结构如下: 一: ...
- vue移动音乐app开发学习(三):轮播图组件的开发
本系列文章是为了记录学习中的知识点,便于后期自己观看.如果有需要的同学请登录慕课网,找到Vue 2.0 高级实战-开发移动端音乐WebApp进行观看,传送门. 完成后的页面状态以及项目结构如下: 一: ...
- webapp开发学习---Cordova环境搭建
Cordova 使用HTML, CSS & JS进行移动App开发;多平台共用一套代码;免费开源 步骤:(来自Cordova官网) 1.安装Cordova(在node.js环境下进行安装) 命 ...
- (一)安卓小app开发之基础环境搭建
一.准备工作: 1.下载Android Studio开发环境 https://dl.google.com/dl/android/studio/ide-zips/2.1.1.0/android-stud ...
- Android开发学习总结(一)——搭建最新版本的Android开发环境
Android开发学习总结(一)——搭建最新版本的Android开发环境(转) 最近由于工作中要负责开发一款Android的App,之前都是做JavaWeb的开发,Android开发虽然有所了解,但是 ...
- 高性能Cordova App开发学习笔记
高性能Cordova App开发学习笔记 文件结构 添加插件 构建准备 各个www的作用,prepare命令会将hello\www的内容会拷贝到platform下的wwww目录,知道该改哪里了吧?如果 ...
- 基于Html5 Plus + Vue + Mui 移动App 开发(二)
基于Html5 Plus + Vue + Mui 移动App 开发(二) 界面效果: 本页面采用Html5 Plus + Vue + Mui 开发移动界面,本页面实现: 1.下拉刷新.上拉获取更多功能 ...
- app开发学习需要经历哪些流程
app开发学习需要经历哪些流程?如何零基础入门app开发?以下是知乎热心开发者的经验总结,对学习app开发有很好的参考意义 1.如果没有编程基础的,学习基础知识的过程肯定是必须的.2.有了一些基础 ...
- 使用Kotlin开发Android应用 - 环境搭建 (1)
一. 在Android Studio上安装Kotlin插件 按快捷键Command+, -> 在Preferences界面找到Plugins -> 点击Browse repositorie ...
随机推荐
- hdu_4336_Card Collector
In your childhood, do you crazy for collecting the beautiful cards in the snacks? They said that, fo ...
- YouCompleteMe
需要配套的.vimrc :sw:.h与.cpp切换 Issue:YouCompleteMe unavailable no module named future cd .vim/Vundle/YouC ...
- java 计算器算法脚本
import javax.script.ScriptEngine; import javax.script.ScriptEngineManager; public String Count(Strin ...
- linux 学习第七天
一.bash 使用(for循环.while循环) 1.1.批量添加用户 1.2.查看用户是否存在 A.cut -d : -f 1 /etc/passwd B.id dream (id 用户名称) C ...
- MySQL必知必会 读书笔记四:数据过滤
过滤数据 WHERE 只检索所需数据需要指定搜索条件( search criteria) ,搜索条件也称为过滤条件( filtercondition) . 在SELECT语句中,数据根据WHERE子句 ...
- svn出现目标计算机积极拒绝无法链接
这是由于没有启动服务器端监控的原因,只需要执行以下代码即可 svnserve -d --listen-port 8000 -r /opt/svn
- 异常笔记:Hadoop异常 namenode.NameNode: Encountered exception during format
00:53:47,977 WARN namenode.NameNode: Encountered exception during format: java.io.IOException: Canno ...
- 【读书笔记 - Effective Java】01. 考虑用静态工厂方法代替构造器
获取类的实例有两种方法: 1. 提供一个公有的构造器(最常用). 2. 提供一个公有的静态工厂方法(static factory method). // 静态工厂方法示例 public static ...
- day 17 成员
1.成员 在类中你能写的所有内容都是类的成员 2.变量 1. 实例变量:昨天写的就是实力变量,由对象去访问的变量 2. 类变量: 这个变量属于类.但是对象也可以访问 ...
- python三大器之while,if,for循环
一.for循环(遍历循环) 在Python你可能要经常遍历列表的所有元素,对每个元素执行相同的操作;对于包含数字的列表,可能要对每个元素进行相同的计算;在网站中,可能需要显示文章中的每个标题等等.某一 ...