Browse Source

upd: cli version

richard1015 5 years ago
parent
commit
9aab96dabf

+ 1 - 2
lib/plugin/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/cli",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "nutui cli",
   "main": "./dist_cli/bin/index.js",
   "files": [
@@ -82,7 +82,6 @@
     "vue-router": "^3.1.3",
     "vue-style-loader": "^4.1.2",
     "vue-template-compiler": "^2.6.11",
-    "vueg": "^1.4.5",
     "webpack": "^4.41.5",
     "webpack-dev-server": "^3.10.1",
     "webpack-merge": "^4.2.2",

+ 38 - 41
lib/plugin/cli/site/demo/app.js

@@ -16,8 +16,6 @@ import './asset/img/logo_share.png';
 
 Vue.config.productionTip = false;
 
-
-
 // Object.assign(en, demoEN);
 
 // Vue.use(NutUI, {
@@ -27,7 +25,6 @@ Vue.config.productionTip = false;
 
 NutUI.install(Vue);
 
-
 //Vue.locale = () => {};
 
 // const i18n = new VueI18n({
@@ -51,42 +48,42 @@ NutUI.install(Vue);
 Vue.mixin(mixin);
 
 const app = new Vue({
-  el: '#demo',
-  router,
-  components: { App },
-  template: '<App/>'
+	el: '#demo',
+	router,
+	components: { App },
+	template: '<App/>'
 });
 
 OfflinePluginRuntime.install({
-  onUpdating: () => {
-    console.log('SW Event:', 'onUpdating');
-  },
-  onUpdateReady: () => {
-    console.log('SW Event:', 'onUpdateReady');
-    OfflinePluginRuntime.applyUpdate();
-  },
-  onUpdated: () => {
-    console.log('SW Event:', 'onUpdated');
-    console.log('PWA缓存有更新,需要刷新页面');
-
-    app.$dialog({
-      title: "当前页面有新版本,请刷新",
-      noCloseBtn: true,
-      noOkBtn: true,
-      cancelBtnTxt: "刷新页面",
-      closeOnClickModal:false,
-      lockBgScroll:true,
-      onCancelBtn(){
-        window.location.reload();
-      }
-    });
-
-    //window.location.reload();
-  },
-
-  onUpdateFailed: () => {
-    console.log('SW Event:', 'onUpdateFailed');
-  }
+	onUpdating: () => {
+		console.log('SW Event:', 'onUpdating');
+	},
+	onUpdateReady: () => {
+		console.log('SW Event:', 'onUpdateReady');
+		OfflinePluginRuntime.applyUpdate();
+	},
+	onUpdated: () => {
+		console.log('SW Event:', 'onUpdated');
+		console.log('PWA缓存有更新,需要刷新页面');
+
+		app.$dialog({
+			title: '当前页面有新版本,请刷新',
+			noCloseBtn: true,
+			noOkBtn: true,
+			cancelBtnTxt: '刷新页面',
+			closeOnClickModal: false,
+			lockBgScroll: true,
+			onCancelBtn() {
+				window.location.reload();
+			}
+		});
+
+		//window.location.reload();
+	},
+
+	onUpdateFailed: () => {
+		console.log('SW Event:', 'onUpdateFailed');
+	}
 });
 
 Vue.prototype.NUTCONF = Conf;
@@ -94,14 +91,14 @@ Vue.prototype.NUTCONF = Conf;
 let pageLoading = app.$toast.loading();
 
 router.beforeEach((to, from, next) => {
-  pageLoading.show();
-  next();
-})
+	pageLoading.show();
+	next();
+});
 
 router.beforeResolve((to, from, next) => {
-  next();
+	next();
 });
 
 router.afterEach((to, from) => {
-  pageLoading.hide();
+	pageLoading.hide();
 });

+ 32 - 55
lib/plugin/cli/site/demo/router.js

@@ -1,73 +1,50 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
 import { packages } from '@/config.json';
-import vueg from 'vueg';
-
-const Index = () => import(/* webpackChunkName: "demo-index" */ './view/index.vue');
-const DemoNav = () => import(/* webpackChunkName: "demo-demonav" */'./view/demonav.vue');
-
-// import Index from './view/index.vue';
-// import DemoNav from './view/demonav.vue';
 
+import Index from './view/index.vue';
+import DemoNav from './view/demonav.vue';
 
 Vue.use(VueRouter);
 
 const routes = [
-  {
-    path: '*',
-    redirect: '/index'
-  },
-  {
-    name:'index',
-    path: '/index',
-    components: {
-      main: Index,
-      demonav: DemoNav,
-    }
-  },
+	{
+		path: '*',
+		redirect: '/index'
+	},
+	{
+		name: 'index',
+		path: '/index',
+		components: {
+			main: Index,
+			demonav: DemoNav
+		}
+	}
 ];
 
 //组件示例页面
 packages.map(item => {
-  if (item.showDemo === false) return;
-  const pkgName =  item.name.toLowerCase();
-  routes.push({
-    path: '/' + item.name,
-    components: {
-      main: () => import(
-        /* webpackChunkName: "demo-[request]" */
-        `@/packages/${pkgName}/demo.vue`),
-      demonav: DemoNav
-    },
-    name: item.name
-  });
+	if (item.showDemo === false) return;
+	const pkgName = item.name.toLowerCase();
+	routes.push({
+		path: '/' + item.name,
+		components: {
+			main: () => import(`@/packages/${pkgName}/demo.vue`),
+			demonav: DemoNav
+		},
+		name: item.name
+	});
 });
 
 const router = new VueRouter({
-  routes,
-  scrollBehavior(to, from, savedPosition) {
-    if (to.path == '/index') {
-      return null;
-    } else {
-      return { x: 0, y: 0 }
-    }
-  }
+	routes,
+	scrollBehavior(to, from, savedPosition) {
+		if (to.path == '/index') {
+			return null;
+		} else {
+			return { x: 0, y: 0 };
+		}
+	}
 });
 
-
-const options = {
-  duration: '0.2', //转场动画时长,默认为0.3,单位秒
-  firstEntryDisable: true, //值为true时禁用首次进入应用时的渐现动画,默认为false
-  firstEntryDuration: '.3', //首次进入应用时的渐现动画时长,默认为.6
-  forwardAnim: 'fadeInRight', //前进动画,默认为fadeInRight
-  backAnim: 'fadeInLeft', //后退动画,默认为fedeInLeft
-  sameDepthDisable: false, //url深度相同时禁用动画,默认为false
-  tabs: [], //默认为[],'name'对应路由的name,以实现类似app中点击tab页面水平转场效果,如tabs[1]到tabs[0],会使用backAnim动画,tabs[1]到tabs[2],会使用forwardAnim动画
-  tabsDisable: false, //值为true时,tabs间的转场没有动画,默认为false
-  shadow: false, //值为false,转场时没有阴影的层次效果
-  disable: false, //禁用转场动画,默认为false,嵌套路由默认为true
-};
-
-Vue.use(vueg, router, options);
-
 export default router;

+ 8 - 9
lib/plugin/cli/site/doc/app.js

@@ -1,5 +1,5 @@
-import Vue from 'vue'
-import App from './App.vue'
+import Vue from 'vue';
+import App from './App.vue';
 import router from './router';
 import copy from 'clipboard';
 import backtop from './compents/backtop/backtop.js';
@@ -7,12 +7,12 @@ import './compents/backtop/backtop.css';
 backtop.install(Vue);
 import 'highlight.js/styles/github.css';
 import VueStickto from './compents/vue-stickto/VueStickto.js';
-Vue.use(VueStickto)
+Vue.use(VueStickto);
 import codes from 'qrcode';
 import { isMobile } from './asset/js/utils.js';
 
 if (isMobile) {
-  location.replace('demo.html' + location.hash);
+	location.replace('demo.html' + location.hash);
 }
 
 Vue.prototype.copy = copy;
@@ -21,9 +21,8 @@ Vue.prototype.qrcode = codes;
 Vue.config.productionTip = false;
 
 new Vue({
-  el: '#doc',
-  router,
-  components: { App },
-  template: '<App/>'
+	el: '#doc',
+	router,
+	components: { App },
+	template: '<App/>'
 });
-

+ 79 - 103
lib/plugin/cli/site/doc/router.js

@@ -1,121 +1,97 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
 import { packages } from '@/config.json';
-import vueg from 'vueg';
 
 import frontCover from './index.vue';
- 
- const Index = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'info' */'./info.vue');
- const Intro = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'intro' */'./page/intro.vue');
- const Start = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'start' */'./page/start.vue');
- const International = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'international' */'./page/international.vue');
- const Theme = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'theme' */'./page/theme.vue');
- const JoinUs = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'joinus' */'./page/joinus.vue');
- //const Update = () => import('./page/changelog.vue');
+
+const Index = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'info' */ './info.vue');
+const Intro = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'intro' */ './page/intro.vue');
+const Start = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'start' */ './page/start.vue');
+const International = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'international' */ './page/international.vue');
+const Theme = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'theme' */ './page/theme.vue');
+const JoinUs = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'joinus' */ './page/joinus.vue');
+//const Update = () => import('./page/changelog.vue');
 
 Vue.use(VueRouter);
 
 const routes = [
-  {
-    path: '*',
-    redirect: '/index'
-  },
-  {
-    path: '/',
-    redirect: '/index'
-  },
-  {
-    path:'/index',
-    name:'frontcover',
-    component:frontCover
-    
-  },
-  {    
-    path: '/intro',
-    name:'intr',
-    components: {
-      default: Index,
-      main: Intro,     
-    }
-  },
-  {    
-    path: '/international',
-    name:'international',
-    components: {
-      default: Index,
-      main: International,     
-    }
-  },
-  {    
-    path: '/start',
-    name:'start',
-    components: {
-      default: Index,
-      main: Start,     
-    }
-  },
-  {    
-    path: '/theme',
-    name:'theme',
-    components: {
-      default: Index,
-      main: Theme,     
-    }
-  },
-  {
-    path: '/joinus',
-    name: 'joinus',
-    components: {
-      default: Index,
-      main: JoinUs,
-    }
-  }
+	{
+		path: '*',
+		redirect: '/index'
+	},
+	{
+		path: '/',
+		redirect: '/index'
+	},
+	{
+		path: '/index',
+		name: 'frontcover',
+		component: frontCover
+	},
+	{
+		path: '/intro',
+		name: 'intr',
+		components: {
+			default: Index,
+			main: Intro
+		}
+	},
+	{
+		path: '/international',
+		name: 'international',
+		components: {
+			default: Index,
+			main: International
+		}
+	},
+	{
+		path: '/start',
+		name: 'start',
+		components: {
+			default: Index,
+			main: Start
+		}
+	},
+	{
+		path: '/theme',
+		name: 'theme',
+		components: {
+			default: Index,
+			main: Theme
+		}
+	},
+	{
+		path: '/joinus',
+		name: 'joinus',
+		components: {
+			default: Index,
+			main: JoinUs
+		}
+	}
 ];
 //组件md文件展示
 packages.map(item => {
-  if (item.showDemo === false) return;
-  const pkgName =  item.name.toLowerCase();
-  routes.push({
-    path: '/' + item.name,
-    components: {      
-      default: Index,
-      main: () => import(
-        /* webpackPrefetch: true */
-        /* webpackChunkName: "doc-[request]" */`./view/${pkgName}.vue`)
-    },
-    name: item.name
-  });
+	if (item.showDemo === false) return;
+	const pkgName = item.name.toLowerCase();
+	routes.push({
+		path: '/' + item.name,
+		components: {
+			default: Index,
+			main: () => import('./view/' + pkgName + '.vue')
+		},
+		name: item.name
+	});
 });
 
 const router = new VueRouter({
-  routes,
-  scrollBehavior(to, from, savedPosition) {
-    if (to.path == '/index') {
-      return null;
-    } else {
-      return { x: 0, y: 0 }
-    }
-  }
+	routes,
+	scrollBehavior(to, from, savedPosition) {
+		if (to.path == '/index') {
+			return null;
+		} else {
+			return { x: 0, y: 0 };
+		}
+	}
 });
 
-
-
-
-
-const options = {
-  duration: '0.3', //转场动画时长,默认为0.3,单位秒
-  firstEntryDisable: false, //值为true时禁用首次进入应用时的渐现动画,默认为false
-  firstEntryDuration: '.4', //首次进入应用时的渐现动画时长,默认为.6
-  forwardAnim: 'fadeInRight', //前进动画,默认为fadeInRight
-  backAnim: 'fadeInLeft', //后退动画,默认为fedeInLeft
-  sameDepthDisable: false, //url深度相同时禁用动画,默认为false
-  tabs: [], //默认为[],'name'对应路由的name,以实现类似app中点击tab页面水平转场效果,如tabs[1]到tabs[0]    ,会使用backAnim动画,tabs[1]到tabs[2],会使用forwardAnim动画
-  tabsDisable: false, //值为true时,tabs间的转场没有动画,默认为false
-  shadow: false, //值为false,转场时没有阴影的层次效果
-  disable: false, //禁用转场动画,默认为false,嵌套路由默认为true
-  nuxt: false //若使用后端渲染框架Nuxt,需要将此设为true,默认为false
-};
-
-Vue.use(vueg, router, options);
-
 export default router;

+ 2 - 2
lib/plugin/cli/src/util/dic.ts

@@ -1,11 +1,11 @@
 import { join, resolve } from 'path';
 
 // cli 目录
-export const ROOT_CLI_PATH = function (dir: string) {
+export const ROOT_CLI_PATH = function(dir: string) {
 	return resolve(__dirname, '../../', dir);
 };
 // nutui src 目录
-export const ROOT_PACKAGE_PATH = function (dir: string) {
+export const ROOT_PACKAGE_PATH = function(dir: string) {
 	return resolve(__dirname, '../../../../../', dir);
 };
 // build dist 目录

+ 1 - 1
lib/plugin/cli/src/webpack/base.config.ts

@@ -52,7 +52,7 @@ export const baseConfig: Webpack.Configuration = {
 			},
 			{
 				test: /\.js$/,
-				include: [ROOT_PACKAGE_PATH('src')],
+				include: [ROOT_PACKAGE_PATH('src'), ROOT_CLI_PATH('site')],
 				use: ['cache-loader', 'babel-loader']
 			},
 			{

+ 3 - 3
lib/plugin/cli/src/webpack/prod.config.ts

@@ -8,10 +8,10 @@ export const prodConfig: Webpack.Configuration = merge(devConfig, {
 	output: {
 		path: ROOT_PACKAGE_PATH('dist/sites'),
 		filename: 'js/[name].[hash].bundle.min.js',
-		chunkFilename: 'js/[name].[chunkhash].chunk.min.js',
+		chunkFilename: 'js/[name].[chunkhash].chunk.min.js'
 	},
 	optimization: {
-		minimize: true,
+		minimize: true
 	},
-	plugins: [new OptimizeCSSAssetsPlugin()],
+	plugins: [new OptimizeCSSAssetsPlugin()]
 });

+ 1 - 1
package.json

@@ -54,7 +54,7 @@
     "@babel/plugin-proposal-object-rest-spread": "^7.9.5",
     "@commitlint/cli": "^8.0.0",
     "@commitlint/config-conventional": "^8.0.0",
-    "@nutui/cli": "^0.1.1",
+    "@nutui/cli": "^0.1.2",
     "@vue/composition-api": "^0.5.0",
     "husky": "^3.0.0",
     "vue-lazyload": "^1.3.3"