DEMO

jQuery

jQuery

React

React

Vue

Vue

How To Use

jQuery 已经默认被 JMS 依赖

对于不支持模块化的文件，插件

1. 在 .ejs 视图文件内引入文件。这里引入的是 jQuery Demo 中的 jquery.sky.carousel 插件资源。

<script src="${publicPath}/assets/vendor/jQuery/plugins/jquery.sky.carousel/jquery.sky.carousel-1.0.2.min.js"></script>
<link href="${publicPath}/assets/vendor/jQuery/plugins/jquery.sky.carousel/jquery.sky.carousel-1.0.2.min.css" rel="stylesheet" />

注： 其中的 ${publicPath} 为发布路径，JMS 会自动解析（仅在 .html 、.ejs 文件内可用）。

2. 在入口文件内 import jQuery 组件。向导页的入口文件是 /src/pages/guide.js （具体参见 页面（资源）规则）。 

import jQueryApp from '../components/jQueryApp';

使用 React 组件

1. 不需要做其他特殊标记，只需在 .ejs 视图页内预留 React 根节点。

<div id="react_app"></div>

2. 在入口文件内 import React 依赖项及组件，渲染 React DOM 节点

import React from 'React'
import ReactDOM from 'ReactDOM'
import ReactApp from '../components/ReactApp.jsx';
import * as service from '../services/commonServices';

ReactDOM.render((
  <div>
    <ReactApp dispatch={service} />
  </div>
), document.getElementById('react_app'));

使用 Vue 组件

1. 不需要做其他特殊标记，只需在 .ejs 视图页内预留 Vue 根节点。

<div id="vue_app"></div>

2. 在入口文件内 import Vue 依赖项及组件，渲染 Vue DOM 节点

import React from 'React'
import Vue from 'vue';
import { Carousel, CarouselItem } from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from '../components/VueApp.vue';

Vue.use(Carousel);
Vue.use(CarouselItem);

new Vue({
  el: '#vue_app',
  render: h => h(App)
});

Tooling

JMS-CLI 是配套 JMS 的标准开发/管理工具。可以通过 JMS-CLI 创建新项目，管理已有项目。简化开发，维护工作量，降低上手难度。

安装 JMS-CLI

npm i jms-cli -g

JMS-CLI 命令

创建一个新项目：create

jms create my-project
create 别名 c： 
jms c my-project

添加一个已存在的项目：add

jms add D:\my-project
add 别名 a： 
jms a D:\my-project

项目管理控制面板：console

控制面板将以占用方式运行。并自动访问浏览器地址：http://localhost:3008/console_board。

jms console
console 别名 cb： 
jms cb

列出本机所有的项目：list

jms list
list 别名 ls： 
jms ls

移除项目（仅移除项目记录，不删硬盘上的文件）：remove

jms remove
remove 别名 rm： 
jms rm

更新项目基本信息：refresh

jms refresh
refresh 别名 re： 
jms re

更换 npm 源：source

jms source
source 别名 s： 
jms s