From cd508cf058a08d0bb54163cc40d4e849e9a6743a Mon Sep 17 00:00:00 2001 From: ddot Date: Mon, 17 Sep 2018 17:30:48 +0800 Subject: [PATCH] Feature/vue (#2) 1: done vue base --- .gitignore | 1 - .prettierignore | 1 + README.md | 3 +- packages/create-umi-vue/.gitignore | 10 ++ packages/create-umi-vue/README.md | 15 +++ packages/create-umi-vue/bin/cli.js | 45 +++++++ packages/create-umi-vue/lib/BasicGenerator.js | 98 ++++++++++++++ packages/create-umi-vue/package.json | 38 ++++++ packages/create-umi-vue/template/app/.env | 1 + .../create-umi-vue/template/app/.gitignore | 122 ++++++++++++++++++ .../template/app/.prettierignore | 8 ++ .../create-umi-vue/template/app/.prettierrc | 5 + .../create-umi-vue/template/app/.umirc.js | 7 + .../create-umi-vue/template/app/_gitignore | 122 ++++++++++++++++++ .../create-umi-vue/template/app/mock/.gitkeep | 0 .../create-umi-vue/template/app/package.json | 27 ++++ .../template/app/src/pages/index.vue | 21 +++ .../create-umi-vue/template/plugins/.gitkeep | 0 packages/umi-plugin-service/.npmignore | 2 - packages/umi-plugin-vue/lib/index.js | 72 +++++++++++ packages/umi-plugin-vue/package.json | 45 +++++++ packages/umi-plugin-vue/src/index.ts | 60 +++++++++ packages/umi-plugin-vue/template/document.ejs | 17 +++ .../umi-plugin-vue/template/empty.js.mustache | 0 .../umi-plugin-vue/template/entry.js.mustache | 40 ++++++ .../template/router.js.mustache | 16 +++ packages/umi-plugin-vue/tsconfig.json | 14 ++ 27 files changed, 786 insertions(+), 4 deletions(-) create mode 100644 packages/create-umi-vue/.gitignore create mode 100644 packages/create-umi-vue/README.md create mode 100755 packages/create-umi-vue/bin/cli.js create mode 100644 packages/create-umi-vue/lib/BasicGenerator.js create mode 100644 packages/create-umi-vue/package.json create mode 100644 packages/create-umi-vue/template/app/.env create mode 100644 packages/create-umi-vue/template/app/.gitignore create mode 100644 packages/create-umi-vue/template/app/.prettierignore create mode 100644 packages/create-umi-vue/template/app/.prettierrc create mode 100644 packages/create-umi-vue/template/app/.umirc.js create mode 100644 packages/create-umi-vue/template/app/_gitignore create mode 100644 packages/create-umi-vue/template/app/mock/.gitkeep create mode 100644 packages/create-umi-vue/template/app/package.json create mode 100644 packages/create-umi-vue/template/app/src/pages/index.vue create mode 100644 packages/create-umi-vue/template/plugins/.gitkeep delete mode 100644 packages/umi-plugin-service/.npmignore create mode 100644 packages/umi-plugin-vue/lib/index.js create mode 100644 packages/umi-plugin-vue/package.json create mode 100644 packages/umi-plugin-vue/src/index.ts create mode 100644 packages/umi-plugin-vue/template/document.ejs create mode 100644 packages/umi-plugin-vue/template/empty.js.mustache create mode 100644 packages/umi-plugin-vue/template/entry.js.mustache create mode 100644 packages/umi-plugin-vue/template/router.js.mustache create mode 100644 packages/umi-plugin-vue/tsconfig.json diff --git a/.gitignore b/.gitignore index dd622a1..3965dab 100644 --- a/.gitignore +++ b/.gitignore @@ -59,7 +59,6 @@ typings/ .yarn-integrity # dotenv environment variables file -.env # parcel-bundler cache (https://parceljs.org/) .cache diff --git a/.prettierignore b/.prettierignore index 95765e9..c4f79b8 100644 --- a/.prettierignore +++ b/.prettierignore @@ -3,3 +3,4 @@ **/*.ejs **/*.html package.json +**/template/app/.umirc.js \ No newline at end of file diff --git a/README.md b/README.md index bb19cb4..7df6ceb 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,4 @@ # umi-plugin -* [@ddot/umi-plugin-service](https://www.npmjs.com/package/@ddot/umi-plugin-service) \ No newline at end of file +* [@ddot/umi-plugin-service](https://www.npmjs.com/package/@ddot/umi-plugin-service) +* [@ddot/umi-plugin-vue](https://www.npmjs.com/package/@ddot/umi-plugin-vue) \ No newline at end of file diff --git a/packages/create-umi-vue/.gitignore b/packages/create-umi-vue/.gitignore new file mode 100644 index 0000000..b0100bd --- /dev/null +++ b/packages/create-umi-vue/.gitignore @@ -0,0 +1,10 @@ +/node_modules +/templates/**/node_modules +/templates/**/npm-debug.log* +/templates/**/yarn-error.log +/templates/**/yarn.lock +/templates/**/package-lock.json +/templates/**/.umi +/templates/**/.umi-production +/templates/**/dist +/yarn.lock \ No newline at end of file diff --git a/packages/create-umi-vue/README.md b/packages/create-umi-vue/README.md new file mode 100644 index 0000000..5c82d3d --- /dev/null +++ b/packages/create-umi-vue/README.md @@ -0,0 +1,15 @@ +# create-umi-vue + +Creates a Vue UmiJS application using the command line. + +## Usage + +```bash +$ yarn create umi-vue +``` + +## LICENSE + +MIT + + diff --git a/packages/create-umi-vue/bin/cli.js b/packages/create-umi-vue/bin/cli.js new file mode 100755 index 0000000..d26eeaa --- /dev/null +++ b/packages/create-umi-vue/bin/cli.js @@ -0,0 +1,45 @@ +#!/usr/bin/env node + +const { existsSync } = require("fs"); +const { join } = require("path"); +const semver = require("semver"); +const chalk = require("chalk"); +const mkdirp = require("mkdirp"); +const clipboardy = require("clipboardy"); + +if (!semver.satisfies(process.version, ">= 8.0.0")) { + console.error( + chalk.red("✘ The generator will only work with Node v8.0.0 and up!") + ); + process.exit(1); +} + +const script = process.argv[2]; +if (script === "-v" || script === "--version") { + console.log(require("../package").version); + if (existsSync(join(__dirname, "../.local"))) { + console.log(chalk.cyan("@local")); + } + process.exit(0); +} + +if (script) { + mkdirp.sync(script); + process.chdir(script); +} + +const BasicGenerator = require("../lib/BasicGenerator"); +const generator = new BasicGenerator(process.argv.slice(2), { + name: "basic", + env: { + cwd: process.cwd() + }, + resolved: __dirname +}); +generator.run(() => { + if (script) { + clipboardy.writeSync(`cd ${script}`); + console.log("📋 Copied to clipboard, just use Ctrl+V"); + } + console.log("✨ File Generate Done"); +}); diff --git a/packages/create-umi-vue/lib/BasicGenerator.js b/packages/create-umi-vue/lib/BasicGenerator.js new file mode 100644 index 0000000..7728d68 --- /dev/null +++ b/packages/create-umi-vue/lib/BasicGenerator.js @@ -0,0 +1,98 @@ +const Generator = require("yeoman-generator"); +const { basename } = require("path"); +const debug = require("debug")("create-umi"); + +module.exports = class BasicGenerator extends Generator { + constructor(args, opts) { + super(args, opts); + + this.name = basename(process.cwd()); + this.props = {}; + } + + // prompting() { + // const prompts = [ + // { + // name: "vue", + // message: "What functionality do your want to enable?", + // type: "checkbox", + // choices: [ ] + // } + // ]; + // return this.prompt(prompts).then(props => { + // this.props = Object.assign(this.props, props); + // }); + // } + + writing() { + debug(`this.name: ${this.name}`); + debug(`this.props: ${JSON.stringify(this.props)}`); + + const context = { + name: this.name, + props: this.props + }; + + this.fs.copy( + this.templatePath("app", "mock", ".*"), + this.destinationPath("mock") + ); + this.fs.copy( + this.templatePath("app", "src", "assets"), + this.destinationPath("src/assets") + ); + this.fs.copy( + this.templatePath("app", "src", "layouts"), + this.destinationPath("src/layouts") + ); + this.fs.copy( + this.templatePath("app", "src", "pages"), + this.destinationPath("src/pages") + ); + this.fs.copy( + this.templatePath("app", "src", "global.css"), + this.destinationPath("src/global.css") + ); + this.fs.copyTpl( + this.templatePath("app", "package.json"), + this.destinationPath("package.json"), + context + ); + this.fs.copy( + this.templatePath("app", "_gitignore"), + this.destinationPath(".gitignore") + ); + this.fs.copy( + this.templatePath("app", ".env"), + this.destinationPath(".env") + ); + this.fs.copyTpl( + this.templatePath("app", ".umirc.js"), + this.destinationPath(".umirc.js"), + context + ); + this.fs.copy( + this.templatePath("app", ".eslintrc"), + this.destinationPath(".eslintrc") + ); + this.fs.copy( + this.templatePath("app", ".prettierrc"), + this.destinationPath(".prettierrc") + ); + this.fs.copy( + this.templatePath("app", ".prettierignore"), + this.destinationPath(".prettierignore") + ); + + if (this.props.react.includes("dva")) { + this.fs.copy( + this.templatePath("app", "src", "models", ".*"), + this.destinationPath("src/models") + ); + this.fs.copy( + this.templatePath("app", "src", "dva.js"), + this.destinationPath("src/dva.js") + ); + } + } +}; diff --git a/packages/create-umi-vue/package.json b/packages/create-umi-vue/package.json new file mode 100644 index 0000000..389f2f8 --- /dev/null +++ b/packages/create-umi-vue/package.json @@ -0,0 +1,38 @@ +{ + "name": "create-umi-vue", + "version": "0.0.2", + "description": "Creates a vue UmiJS application using the command line.", + "bin": { + "create-umi": "./bin/cli.js" + }, + "dependencies": { + "chalk": "^2.4.1", + "clipboardy": "^1.2.3", + "debug": "^3.1.0", + "mkdirp": "^0.5.1", + "semver": "^5.5.1", + "yeoman-generator": "^3.1.1" + }, + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/jetsly/umi-plugin/tree/master/packages/create-umi-vue" + }, + "homepage": "https://github.com/jetsly/umi-plugin/tree/master/packages/create-umi-vue", + "authors": [ + "jetsly =8.0.0" + } + } + \ No newline at end of file diff --git a/packages/create-umi-vue/template/app/src/pages/index.vue b/packages/create-umi-vue/template/app/src/pages/index.vue new file mode 100644 index 0000000..cb8621c --- /dev/null +++ b/packages/create-umi-vue/template/app/src/pages/index.vue @@ -0,0 +1,21 @@ + + diff --git a/packages/create-umi-vue/template/plugins/.gitkeep b/packages/create-umi-vue/template/plugins/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/packages/umi-plugin-service/.npmignore b/packages/umi-plugin-service/.npmignore deleted file mode 100644 index 5684010..0000000 --- a/packages/umi-plugin-service/.npmignore +++ /dev/null @@ -1,2 +0,0 @@ -/examples -/src \ No newline at end of file diff --git a/packages/umi-plugin-vue/lib/index.js b/packages/umi-plugin-vue/lib/index.js new file mode 100644 index 0000000..fee8b10 --- /dev/null +++ b/packages/umi-plugin-vue/lib/index.js @@ -0,0 +1,72 @@ +"use strict"; +var __assign = + (this && this.__assign) || + function() { + __assign = + Object.assign || + function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + return t; + }; + return __assign.apply(this, arguments); + }; +Object.defineProperty(exports, "__esModule", { value: true }); +var path_1 = require("path"); +var VueLoaderPlugin = require("vue-loader/lib/plugin"); +function template(path) { + return path_1.join(__dirname, "../template", path); +} +function default_1(api, options) { + var service = api.service, + config = api.config, + paths = api.paths; + var mountElementId = config.mountElementId || "root"; + service.paths = __assign({}, service.paths, { + defaultEntryTplPath: template("entry.js.mustache"), + defaultRouterTplPath: template("empty.js.mustache"), + defaultDocumentPath: template("document.ejs") + }); + api.modifyRoutes(function(memo) { + return [ + { + path: "/" + } + ]; + }); + api.chainWebpackConfig(function(webpackConfig) { + webpackConfig.resolve.extensions.merge([".vue"]); + webpackConfig.module + .rule("exclude") + .exclude.add(/\.(vue)$/) + .end(); + webpackConfig.module + .delete("jsx") + .rule("vue") + .test(/\.vue$/) + .include.add(paths.cwd) + .end() + .exclude.add(/node_modules/) + .end() + .use("vue-loader") + .loader(require.resolve("vue-loader")); + webpackConfig.plugin("vue-plugin").use(VueLoaderPlugin); + return webpackConfig; + }); + api.modifyEntryRender(function() { + return ( + ' new Vue({\n el: "#' + + mountElementId + + "\",\n render (h) {\n return h(require('" + + paths.absSrcPath + + "pages/index').default)\n }\n }); " + ); + }); + api.modifyEntryHistory(function() { + return "undefined"; + }); +} +exports.default = default_1; diff --git a/packages/umi-plugin-vue/package.json b/packages/umi-plugin-vue/package.json new file mode 100644 index 0000000..e9f3bbd --- /dev/null +++ b/packages/umi-plugin-vue/package.json @@ -0,0 +1,45 @@ +{ + "name": "@ddot/umi-plugin-vue", + "version": "0.0.1", + "description": "A umi plugin for support vuejs", + "main": "./lib/index.js", + "authors": [ + "jetsly { + return [ + { + path: "/" + } + ]; + }); + + api.chainWebpackConfig(webpackConfig => { + webpackConfig.resolve.extensions.merge([".vue"]); + + webpackConfig.module + .rule("exclude") + .exclude.add(/\.(vue)$/) + .end(); + + webpackConfig.module + .delete("jsx") + .rule("vue") + .test(/\.vue$/) + .include.add(paths.cwd) + .end() + .exclude.add(/node_modules/) + .end() + .use("vue-loader") + .loader(require.resolve("vue-loader")); + webpackConfig.plugin("vue-plugin").use(VueLoaderPlugin); + return webpackConfig; + }); + api.modifyEntryRender(() => { + return ` new Vue({ + el: "#${mountElementId}", + render (h) { + return h(require('${paths.absSrcPath}pages/index').default) + } + }); `; + }); + api.modifyEntryHistory(() => { + return "undefined"; + }); +} diff --git a/packages/umi-plugin-vue/template/document.ejs b/packages/umi-plugin-vue/template/document.ejs new file mode 100644 index 0000000..9042280 --- /dev/null +++ b/packages/umi-plugin-vue/template/document.ejs @@ -0,0 +1,17 @@ + + + + + + + + + +<%= context.title %> + + + +
+ + + \ No newline at end of file diff --git a/packages/umi-plugin-vue/template/empty.js.mustache b/packages/umi-plugin-vue/template/empty.js.mustache new file mode 100644 index 0000000..e69de29 diff --git a/packages/umi-plugin-vue/template/entry.js.mustache b/packages/umi-plugin-vue/template/entry.js.mustache new file mode 100644 index 0000000..3b84c75 --- /dev/null +++ b/packages/umi-plugin-vue/template/entry.js.mustache @@ -0,0 +1,40 @@ +{{{ importsAhead }}} +import Vue from 'vue'; +{{{ imports }}} + +{{{ codeAhead }}} + +// create history +window.g_history = {{{ history }}}; + +// render +function render() { + {{{ render }}} +} + +const moduleBeforeRendererPromises = []; +{{# moduleBeforeRenderer }} +if (typeof {{ specifier }} === 'function') { + const promiseOf{{ specifier }} = {{ specifier }}(); + if (promiseOf{{ specifier }} && promiseOf{{ specifier }}.then) { + moduleBeforeRendererPromises.push(promiseOf{{ specifier }}); + } +} +{{/ moduleBeforeRenderer }} + +Promise.all(moduleBeforeRendererPromises).then(() => { + render(); +}).catch((err) => { + if (process.env.NODE_ENV === 'development') { + console.error(err); + } +}); + +{{{ code }}} + +// hot module replacement +if (module.hot) { + module.hot.accept('./router', () => { + render(); + }); +} \ No newline at end of file diff --git a/packages/umi-plugin-vue/template/router.js.mustache b/packages/umi-plugin-vue/template/router.js.mustache new file mode 100644 index 0000000..0f926b2 --- /dev/null +++ b/packages/umi-plugin-vue/template/router.js.mustache @@ -0,0 +1,16 @@ +{{{ importsAhead }}} +import React from 'react'; +import { Router as DefaultRouter, Route, Switch } from 'react-router-dom'; +import dynamic from 'umi/dynamic'; +import renderRoutes from 'umi/_renderRoutes'; +{{{ imports }}} + +let Router = {{{ RouterRootComponent }}}; + +let routes = {{{ routes }}}; + +export default function() { + return ( +{{{ routerContent }}} + ); +} \ No newline at end of file diff --git a/packages/umi-plugin-vue/tsconfig.json b/packages/umi-plugin-vue/tsconfig.json new file mode 100644 index 0000000..15f380a --- /dev/null +++ b/packages/umi-plugin-vue/tsconfig.json @@ -0,0 +1,14 @@ +{ + "compilerOptions": { + "outDir": "lib", + "experimentalDecorators": true, + "emitDecoratorMetadata": true, + "suppressImplicitAnyIndexErrors": true, + "allowSyntheticDefaultImports": true, + "module": "commonjs", + "target": "es5", + "lib": ["es6", "es7"] + }, + "include": ["./src/**/*"], + "exclude": ["./src/**/*.spec.*"] +}