mimi
介绍: 该项目基于vue的移动端项目,没有使用UI框架,后端基于node express,
前端仓库: https://gitee.com/yango520/mimi
后端跟后台仓库: https://gitee.com/yango520/messageBoard
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
需要安装的依赖
npm i axios -S //http请求
npm install style-loader sass-loader node-sass --save-dev //安装sass
vue 中引入sass报错的注意事项 ,点击这里查看
为了移动端自配,将引入外部flexible.js进行适配,将flexible.js放在/static/js/目录下,然后在/src/main.js下引入
import '../static/js/flexible.js'
因为没有用到UI框架,然后自己封装了Toast跟msgBox弹窗 /src/commponents下
配置别名 在build/webpack.base.conf.js
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'common': resolve('src/components'),
'styles': resolve('src/styles'),
'pages': resolve('src/pages'),
'api': resolve('src/api')
}
当页面跳转的时候,新页面会在上一页所在的位置,如何在跳转新页面的时候新页面在顶部位置呢?
//在router/index.js 默认输出 router,则在main.js里写
import router from './router'
router.afterEach((to, from, next) => {
window.scrollTo(0, 0)
});
暂时没办法详细讲解, 可以看源码,源码写的也比较粗糙
下面看一下效果图