美文网首页饥人谷技术博客
Vue.js实现小米商城

Vue.js实现小米商城

作者: kumabearplus | 来源:发表于2017-07-13 16:54 被阅读1076次

    前言

    由于刚开始接触框架,我感觉一片茫然。框架太多,我该怎么选择?好像BootStrap是时下最火的前端框架吧?而未来的主流应该是Vue和React?

    因为这些琐事,我耽误了自己将近半个月的时间。在这期间,我发现自己遇到新事物会不由自主地去逃避。后来,我想通了———与其想一些没用的东西,不如现学现卖——我已经学了Vue,为什么不用Vue做一个网站呢?因此,在网上查阅了一些相关资料后,我决定使用Vue框架来实现小米商城的首页。

    动手开始干

    既然已经选择使用Vue,那就需要安装它

    npm i -g vue-cli // 全局安装
    vue init webpack . // 将当前文件夹初始化为一个项目
    npm i // 安装依赖
    npm run dev // 本地自动打开有一个网页,实时显示页面

    本页面的样式使用sass来编写,因此需要安装插件来支持

    npm i -S sass-loader node-sass

    想在线上查看效果

    npm run build

    其他配置

    配置.png

    效果及代码

    在线预览
    代码仓库

    后记

    这个效果做下来,感觉收获颇丰,并且自己对框架有了全新的认知,感觉自己打开了一扇新世界的大门。同时既然选择了做这个项目,就要坚持下去,有始有终!!

    相关文章

      网友评论

        本文标题:Vue.js实现小米商城

        本文链接:https://www.haomeiwen.com/subject/uynwhxtx.html