搭建node.js开发平台
1.安装node.js
本项目的开发和调试工作全部依赖于node.js来完成。请移步node.js官网 根据当前操作系统下载对应的软件版本,按照对应操作提示完成软件安装,本文暂不赘述。
2.安装开发所需工具及插件
通过cmd命令打开对应的项目文件夹,输入 npm install 安装配置文件中所有依赖的开发工具和项目必需组件。
3.快速开发
【开发模式】 输入
npm run dev通过http://127.0.0.1:8080/ 即可访问本地开发环境下的项目并进行开发工作。本地每次保存修改,开发环境中的代码热替换(HMR)插件将会实时刷新浏览器;【生产模式】 输入
npm run build将项目文件编译打包至根目录dist文件夹下,可用于项目生产。
目录简介和一览
以下为框架基础目录结构:
│ .gitignore # git忽略文件列表
│ package.json # 项目配置
│ readme.md # 项目说明
│ index.html # 首页入口
├─ static # 静态首页模板
├─ dist # 生产文件
│ └─ index.html
├─ node_modules # node 开发组件和功能模块
│
├─ config
│ │ css-loaders.js # css 文件加载配置
│ │ webpack.base.config.js # webpack 基础配置
│ │ webpack.dev.config.js # webpack 开发配置
│ └─ webpack.pro.config.js # webpack 生产配置
│
└─ src
├─ vux # vux 项目核心
│ │ main.js # 项目启动配置
│ │ routers.js # 路由路径配置
│ ├─ libs
│ │ │ filters.js # 过滤器
│ │ │ storage.js # 存储器
│ │ └─ utils.js # 工具库
│ └─ units # 项目基础模板结构
│ │ app.vue # 主模板
│ │ footer.vue # 底部模板
│ └─ header.vue # 头部模板
│
├─ plugins # 常用插件库
├─ mods # 功能演示组件
│ ├─ example # 插件演示案例
│ │ main.vue # 演示首页
│ │ ui.vue # 常用ui组件(暂无)
│ │ doc.vue # 框架文档
│ └─ plugin.vue # 组件演示
│
└─ assets
├─ css # 公用css
├─ font # 字体文件
├─ svg # svg矢量图
└─ img # 图片资源