Coder Social home page Coder Social logo

ganlinzhen / vue2-cnode Goto Github PK

View Code? Open in Web Editor NEW

This project forked from gnipbao/vue2-cnode

0.0 0.0 0.0 1.04 MB

vue2 +webpack+ sass+ vuex + vue-router+ axios

Home Page: https://gnipbao.github.io/vue2-cnode/#/list

JavaScript 37.45% HTML 0.79% Vue 57.64% CSS 4.12%

vue2-cnode's Introduction

vue2-cnode

学习使用vue2 搭建移动版cnode 基于官方vue-cli生成 接口由cnodejs.org官方提供 https://cnodejs.org/api

技术栈

  • vue2 + webpack + vuex + sass + vue-router + axios
  • 布局采用阿里团队的高清方案

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:3030
npm run dev

# build for production with minification
npm run build

目录结构

.
|-- build                           // vue-cli构建目录                       
|-- config                           
|   |-- dev.env.js
|   |-- index.js 
|   |-- prod.env.js                    
|-- src                              // 源码目录
|   |-- components                   // 公共组件
|       |-- backtop.vue              
|       |-- header.vue            
|       |-- loading.vue               
|       |-- menu.vue               
|       |-- reply.js                 
|       |-- userinfo.vue              
|   |-- assets                       // 各种静态资源
|   |-- style                        // 样式文件
|       |-- common.scss              // 全局通用scss文件
|       |-- main.scss                // 主页样式
|       |-- mixin.scss               // 定义混入样式函数
|   |-- config                       // 组件的一些配置
|       |-- api.js 
|       |-- env.js                   // 环境参数配置
|   |-- pages                        // 各种页面组件
|       |-- about                    // 关于
|       |-- index                    // 首页
|       |-- login                    // 登录
|       |-- message                  // 消息列表
|       |-- newTopic                 // 发布主题页
|       |-- topic                    // 主题详情
|       |-- topicList                // 主题列表
|       |-- user                     // 查看用户资料
|   |-- router 
|       |--router.js                 //路由配置
|   |-- store                        // vuex的状态管理
|       |-- index.js                 // 加载各种store模块
|       |-- mutationTypes.js         // mutationTypes
|       |-- action.js                // action可以分出来
|       |-- getter.js                // getter需要时候可以划分
|       |-- topicTab.js              // tab选项
|   |-- utils                        // 公共的js方法
|   |-- App.vue                      // 页面入口文件
|   |-- main.js                      // 程序入口文件,加载各种公共组件
|-- index.html                       // 程序入口根组件  
|-- .editorconfig                    // 编辑器配置
|-- .gitignore                       // git忽略文件配置
|-- .babelrc                         // ES6语法编译配置
|-- README.md                        // 项目说明
|-- package.json                     // 配置项目相关信息,通过执行 npm init 命令创建

在线效果

preview

vue2-cnode's People

Contributors

gnipbao avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.