gingerredjade / flink-userportrait-VuejsShow

基于Flink流处理的动态实时亿级全端用户画像系统可视化界面

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

flink-userportrait-VuejsShow

A Vue.js project

Build Setup

# 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

For a detailed explanation on how things work, check out the guide and docs for vue-loader.

Vue结合NodeJS搭建环境

Vue.js 是一个JavaScript MVVM库,是一套构建用户界面的渐进式框架。

Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的**构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API,使得我们能够快速地上手并使用Vue.js

Windows环境

1、 下载NodeJS

如下载、安装node-v8.11.4_x64.msi
npm install webpack -g
npm install --global vue-cli
npm install --registry=https://registry.npm.taobao.org

node -v 显示node.js版本表示node.js安装成功
npm -v  显示npm版本表示npm安装成功

2、 在nodejs安装目录下建立文件夹node_cache、node_global用来安装过程的缓存文件以及最终的模块位置

将npm的全局模块目录和缓存目录配置到刚刚创建的那两个目录。

npm config set prefix "...\node_global"
npm config set cache "...\node_cache"

配置系统环境变量

NODE_PATH=...\node_modules

用户变量增加

PATH加 ...\global

3、 安装一个module测试一下,如最常用的express模块

npm install express -g

它会安装在...\modules目录下

4、 WebStorm构建Vue项目

File-->New Project-->Vue.js,打包方式选择webpack,等待生成项目。

5、 安装highcharts

npm install highcharts --save

6、 项目管理

启动:
右键package.json-->show npm scripts-->dev
或者直接使用命令npm run dev

打包:
npm run build

About

基于Flink流处理的动态实时亿级全端用户画像系统可视化界面


Languages

Language:JavaScript 47.9%Language:HTML 42.9%Language:CSS 8.3%Language:Vue 0.8%Language:PHP 0.1%