├── anu-demo
├── .babelrc
├── index.html
├── package.json
├── src
│ ├── index.js
│ └── Loading.js
└── webpack.config.js
├── .gitignore
├── .npmignore
├── README.md
├── package.json
├── LICENSE
└── index.js
/anu-demo/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | "env",
4 | "react",
5 | "stage-0"
6 | ],
7 | "plugins": [
8 | "syntax-dynamic-import"
9 | ]
10 | }
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | /nbproject/private/
2 | /node_modules/*
3 | /md/*
4 | /coverage/
5 | package-lock.json
6 | node_modules/
7 | chromedriver
8 | selenium-server-*
9 | /.vscode/*
10 | /.history/*
11 | xxx.js
12 | index.css
13 | stand.js
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | /nbproject/private/
2 | /node_modules/*
3 | /md/*
4 | /coverage/
5 | /test/*
6 | /benchmarks/*
7 | /package-lock.json
8 | node_modules/
9 | /index*.html
10 | /version.md
11 | karma.conf.js
12 | chromedriver
13 | selenium-server-*
14 | /.vscode/*
15 | /.history/*
16 | /xxx.js
17 | /index.css
18 | /stand.js
19 |
--------------------------------------------------------------------------------
/anu-demo/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | anujs的脚手架
8 |
9 |
10 |
11 |
12 | Hello Anujs
13 |
14 |
15 |
16 |
17 |
18 |
19 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # create-anu-app
2 |
3 | anujs的官方脚手架
4 |
5 | 安装（还没有发到npm上去，请不要急。心急先用npm link）
6 | ```javascript
7 | yarn global add create-anu-app
8 | ```
9 |
10 | 使用
11 |
12 | ```javascript
13 | create-anu-app projectName --ie
14 | // 第一个参数是项目名， 第二是支持IE8，可选
15 | create-anu-app projectName
16 | // 创建一个基于anujs的项目
17 | create-anu-app -v
18 | // 查询anu-cli的版本号
19 | create-anu-app -h
20 | // 查询anu-cli的所有功能
21 | ```
22 |
23 |
24 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "create-anu-app",
3 | "version": "1.0.1",
4 | "description": "anujs的脚手架",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "bin": {
10 | "create-anu-app": "index.js"
11 | },
12 | "author": "RubyLouvre",
13 | "license": "ISC",
14 | "dependencies": {
15 | "shelljs": "^0.8.1",
16 | "webpack": "^4.0.0-beta.3",
17 | "webpack-dev-server": "^3.1.1"
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/anu-demo/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "anu-cli",
3 | "version": "1.0.0",
4 | "description": "anujs的脚手架",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "start:dev": "webpack-dev-server"
9 | },
10 | "author": "RubyLouvre",
11 | "license": "ISC",
12 | "dependencies": {
13 | "anujs": "^1.3.0",
14 | "babel-core": "^6.26.0",
15 | "babel-loader": "^7.1.4",
16 | "babel-plugin-import": "^1.6.7",
17 | "babel-plugin-syntax-dynamic-import": "^6.18.0",
18 | "babel-preset-env": "^1.6.1",
19 | "babel-preset-react": "^6.24.1",
20 | "babel-preset-stage-0": "^6.24.1"
21 | },
22 | "devDependencies": {
23 | "webpack": "^4.0.0-beta.3",
24 | "webpack-cli": "^2.0.12",
25 | "webpack-dev-server": "^3.1.1",
26 | "react-loadable": "^5.3.1"
27 | }
28 | }
--------------------------------------------------------------------------------
/anu-demo/src/index.js:
--------------------------------------------------------------------------------
1 | import React, { Compoent } from "react";
2 | import ReactDOM from "react-dom";
3 | import { Loading } from "./Loading";
4 |
5 |
6 | class Child extends React.Component {
7 | constructor(props) {
8 | super(props);
9 | }
10 | render() {
11 | console.log(this.props.value);
12 | return this.props.value;
13 | }
14 | }
15 |
16 | function Wrapper(props) {
17 | return (
)
18 | }
19 |
20 | const RefForwardingComponent = React.forwardRef((props, ref) => (
21 |
22 | ));
23 |
24 | let setRefCount = 0;
25 | let ref;
26 |
27 | const setRef = r => {
28 | setRefCount++;
29 | ref = r;
30 | };
31 |
32 | window.onload = function(){
33 | var container = document.querySelector("#app")
34 | ReactDOM.render(, container);
35 | console.log(ref)
36 | }
37 |
38 |
--------------------------------------------------------------------------------
/anu-demo/src/Loading.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | export let Loading = class extends React.Component {
4 | constructor(props, context) {
5 | super(props, context)
6 | this.state = {
7 | dots: ["."]
8 | }
9 | }
10 | componentDidMount() {
11 | this.timer = setTimeout(() => {
12 | this.setState({
13 | dots: [".."]
14 | })
15 | }, 300)
16 | }
17 | componentDidUpdate() {
18 | this.timer = setTimeout(() => {
19 | var n = this.state.dots.length
20 | if (n < 7) {
21 | this.setState({
22 | dots: new Array(n + 1).fill(".")
23 | })
24 | } else {
25 | this.setState({
26 | dots: ["."]
27 | })
28 | }
29 | }, 300)
30 | }
31 | componentWillUnmount() {
32 | clearInterval(this.timer)
33 | }
34 | render() {
35 | return 加载中{this.state.dots}
36 | }
37 | }
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2018 司徒正美
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/anu-demo/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path')
2 | const webpack = require('webpack')
3 |
4 | console.log('输出', path.resolve(__dirname, 'dist'))
5 | const ROOT_PATH = path.resolve(__dirname);
6 |
7 | module.exports = {
8 | entry: ['webpack-dev-server/client?http://localhost:8080',
9 | 'webpack/hot/only-dev-server',
10 | './src/index.js'],
11 | output: {
12 | filename: 'bundle.js',
13 | publicPath: "/assets/",
14 | path: path.resolve(__dirname, 'dist')
15 | },
16 | 'mode': 'development',
17 | module: {
18 | rules: [
19 | {
20 | test: /\.js$/,
21 | use: 'babel-loader',
22 | exclude: /node_modules|vendor|bootstrap/
23 | }
24 | ]
25 | },
26 | resolve: {
27 | extensions: ['.js', '.jsx'],
28 | alias: {
29 | react: 'anujs',
30 | 'react-dom': 'anujs'
31 | }
32 | },
33 | devServer: {
34 | watchOptions: {
35 | aggregateTimeout: 300,
36 | poll: 1000
37 | },
38 | hot: true,
39 | headers: { "X-Custom-Header": "yes" },
40 | historyApiFallback: true,
41 | inline: true, //注意：不要写colors:true，progress:true等，webpack2.x已不支持这些
42 | },
43 | plugins: [
44 | new webpack.HotModuleReplacementPlugin()
45 | ]
46 | }
47 |
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env node
2 |
3 | const readline = require('readline')
4 | const fs = require('fs')
5 | const path = require('path')
6 | const json = require('./package.json')
7 | const shell = require('shelljs');
8 |
9 | let cliPath = process.cwd(), projectName, args = process.argv.slice(2);
10 |
11 |
12 | const rl = readline.createInterface({
13 | input: process.stdin,
14 | output: process.stdout
15 | }).on('close', () => {
16 | buildProject(path.resolve(cliPath, projectName))
17 | })
18 |
19 | getAnswer.apply(null, args);
20 |
21 | function getAnswer(a, b) {
22 | switch (a) {
23 | case '-h':
24 | console.log(`
25 | -h 提问
26 | -v 版本号
27 | projectName --ie 输入项目名，及可选的旧式IE支持，正式建立项目
28 | `)
29 | break
30 | case '-v':
31 | console.log('当前版本是' + json.version)
32 | break
33 | default:
34 | let ie = b == '--ie';
35 | projectName = a;
36 | if (!projectName) {
37 | rl.question('请输入项目名 ', getAnswer);
38 | } else {
39 | if (fs.existsSync(projectName)) {
40 | rl.question('当前目录下已经存在此文件或文件夹名，请改一个新名字', getAnswer)
41 | } else {
42 | rl.close()
43 | }
44 | }
45 | break
46 | }
47 | }
48 |
49 |
50 | function buildProject(pathName, supportIE) {
51 | shell.mkdir(pathName)
52 | console.log(`拷贝模板工程。。。`)
53 | shell.cp("-r", __dirname + '/anu-demo/.*', pathName)
54 | shell.cp("-r", __dirname + '/anu-demo/*', pathName)
55 | // 上面两个相当于
56 | // require('fs-extra').copySync(__dirname + '/anu-demo/', pathName)
57 | console.log(`拷贝模板工程完成。。。`)
58 | shell.cd(pathName)
59 | console.log(`执行 yarn install。。。`)
60 | if (shell.exec('yarn').code !== 0) {
61 | shell.echo('yarn 安装失败');
62 | shell.exit(1);
63 | }
64 | if (shell.which('webpack')) {
65 | if (shell.exec('webpack').code !== 0) {
66 | shell.echo('webpack 安装失败');
67 | shell.exit(1);
68 | }
69 | } else {
70 | shell.echo('Sorry, please **yarn webpack**');
71 | shell.exit(1);
72 | }
73 | shell.exec('npm run start:dev')
74 | console.log("\x1b[36m%s\x1b[0m", "请在浏览器打开 http://localhost:8080")
75 | }
76 |
--------------------------------------------------------------------------------