xportal
v0.1.3
Published
erp 手机端 前端项目
Downloads
5
Readme
xtravel-pc-v1
erp PC 前端项目
依赖安装
npm install element-ui --save
借助 babel-plugin-component,我们可以只引入需要的组件,以达到减小项目体积的目的
npm install babel-plugin-component -dev
npm install vuex --save
预编译语言
npm install sass --save
npm install css-loader --save
npm install sass-loader node-sass --save
表达验证依赖
npm install async-validator --save
ajax 依赖
npm install axios --save
token 解析插件
npm install jsonwebtoken --save
解决 ie 对 Promise(es6 语法)兼容问题,/* 在 main.js 文件夹中引入 */
npm install es6-promise --save
如果 chromedriver 安装出现问题,可以考虑使用如下命名
npm install --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver
storage 工具插件
npm install vue2-storage --save
加密解密依赖
npm install crypto-js --save
时间操作工具
npm install moment --save
图表
npm install echarts --save
金额工具
npm install numeral --save
vue-loader
- vue-loader在项目创建时会自动安装这个依赖,但是要注意版本要在“14.2.4”以上(包括“14.2.4”)
webpack-merge
解决线上打包图片的问题
npm install webpack-merge --save
vue-infinite-scroll
无限滚动组件
npm install vue-infinite-scroll --save
webpack-bundle-analyzer
项目优化报告插件
npm install webpack-bundle-analyzer --save-dev
生成报告
image-webpack-loader
图片压缩
npm install image-webpack-loader --save
compression-webpack-plugin
代码压缩
npm install compression-webpack-plugin --save-dev
webpack-uglify-harmony-plugin
js代码压缩
npm install webpack-uglify-harmony-plugin --save
mini-css-extract-plugin
css 代码分离
npm install mini-css-extract-plugin --save
html-webpack-plugin
html 代码压缩
npm install html-webpack-plugin --save
optimize-css-assets-webpack-plugin
css 压缩
npm install optimize-css-assets-webpack-plugin --save-dev
babel-plugin-component
局部组件加载
npm i babel-plugin-component --save
prerender-spa-plugin
预渲染
npm i -D prerender-spa-plugin
babel-plugin-transform-remove-console
去除 console.log
npm i --D babel-plugin-transform-remove-console
glob-all purgecss-webpack-plugin
出掉多余的css
npm i -D glob-all purgecss-webpack-plugin
压缩js代码
npm install terser-webpack-plugin --save-dev
babel-plugin-syntax-dynamic-import
动态语法解析
npm install babel-plugin-syntax-dynamic-import --save-dev
@xunlei/vue-lazy-component
组件层面懒加载
npm i @xunlei/vue-lazy-component
移动端依赖
vux-loader
按需引入需要的插件
npm install vux-loader --save-dev
less, less-loader
解析 less
npm install less less-loader --save-dev
fastclick
解决移动端点击穿透延迟
npm install fastclick --save
Build Setup
bash
# 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
# run unit tests
npm run unit
# run e2e tests
npm run e2e
# run all tests
npm test
示例 demo 查看说明
- 组件说明和描述
<!-- erp 项目中的组件和说明描述都放在 portal 项目下的 component-description.md 文件中 -->
portal->component-description.md
- 组件
demo
地址:
<!--
erp 项目中所有已封装的组件的 demo 都放在 frame 项目下的 demo 文件夹中
demoComponent.vue 文件表示组件的 demo 实例,可以查看是否有自己需要的组件
demoForm.vue 表示 form 表单组件
invoiceAdd.vue form 表单组件,代码生成器生成的
invoiceList.vue table 列表组件,代码生成器生成的
-->
frame -> demo -> demoComponent.vue
-> demoForm.vue
-> invoiceAdd.vue
-> invoiceList.vue
- 全局公用样式查看
<!--
erp 系统中的全局公共演示放在 portal 项目下的 src -> css 文件 -> public -> commonBase.scss
commonBase.scss 全局公共样式,无须引入,直接拿过来用
commonBase.css 是 commonBase.html 中,使用的静态资源文件
具体样式如何,可以直接在浏览器中打开 commonBase.html
-->