├── .gitignore ├── docs ├── .dockerignore ├── website │ ├── static │ │ ├── img │ │ │ ├── logo.png │ │ │ ├── favicon.ico │ │ │ ├── oss_logo.png │ │ │ ├── undraw_note_list.svg │ │ │ ├── undraw_code_review.svg │ │ │ └── undraw_operating_system.svg │ │ └── css │ │ │ └── custom.css │ ├── sidebars.json │ ├── package.json │ ├── pages │ │ └── en │ │ │ ├── users.js │ │ │ ├── help.js │ │ │ └── index.js │ ├── siteConfig.js │ ├── core │ │ └── Footer.js │ └── README.md ├── docs │ ├── building.md │ ├── structure.md │ ├── scripts.md │ ├── gettingStarted.md │ ├── projects.md │ ├── howContribute.md │ └── codeConduct.md ├── Dockerfile ├── .gitignore └── docker-compose.yml ├── .prettierrc ├── packages ├── create-react-dependency │ ├── template │ │ ├── src │ │ │ ├── lib │ │ │ │ ├── index.js │ │ │ │ └── Lib.js │ │ │ └── dev │ │ │ │ ├── logo.png │ │ │ │ ├── index.js │ │ │ │ ├── index.html │ │ │ │ ├── App.js │ │ │ │ └── index.css │ │ ├── README.md │ │ └── gitignore │ ├── stages │ │ ├── createTemplate.js │ │ ├── initializeGit.js │ │ ├── installDependencies.js │ │ └── createPackageJson.js │ ├── utils │ │ └── copyFolder.js │ ├── package.json │ ├── README.md │ └── index.js └── react-dependency-scripts │ ├── utils │ ├── resolverPath.js │ ├── deletePath.js │ └── readAllFiles.js │ ├── configs │ ├── jest │ │ ├── cssTransform.js │ │ ├── babelTransform.js │ │ └── fileTransform.js │ ├── babelConfig.js │ ├── jestConfig.js │ └── webpack.config.js │ ├── scripts │ ├── build-app.js │ ├── test.js │ ├── start.js │ └── build.js │ ├── index.js │ ├── README.md │ └── package.json ├── lerna.json ├── .travis.yml ├── package.json ├── CONTRIBUTING.md ├── LICENSE ├── .eslintrc.json ├── CODE_OF_CONDUCT.md └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | *.log -------------------------------------------------------------------------------- /docs/.dockerignore: -------------------------------------------------------------------------------- 1 | */node_modules 2 | *.log 3 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true 3 | } 4 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/src/lib/index.js: -------------------------------------------------------------------------------- 1 | export { default } from './Lib'; 2 | -------------------------------------------------------------------------------- /docs/website/static/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/andrelmlins/create-react-dependency/HEAD/docs/website/static/img/logo.png -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "packages": ["packages/*"], 3 | "useWorkspaces": true, 4 | "npmClient": "yarn", 5 | "version": "1.0.6" 6 | } 7 | -------------------------------------------------------------------------------- /docs/website/static/img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/andrelmlins/create-react-dependency/HEAD/docs/website/static/img/favicon.ico -------------------------------------------------------------------------------- /docs/website/static/img/oss_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/andrelmlins/create-react-dependency/HEAD/docs/website/static/img/oss_logo.png -------------------------------------------------------------------------------- /docs/docs/building.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: building 3 | title: Building your Dependency 4 | sidebar_label: Building your Dependency 5 | --- 6 | 7 | To do 8 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/src/dev/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/andrelmlins/create-react-dependency/HEAD/packages/create-react-dependency/template/src/dev/logo.png -------------------------------------------------------------------------------- /docs/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:lts 2 | 3 | WORKDIR /app/website 4 | 5 | EXPOSE 3000 35729 6 | COPY ./docs /app/docs 7 | COPY ./website /app/website 8 | RUN yarn install 9 | 10 | CMD ["yarn", "start"] 11 | -------------------------------------------------------------------------------- /docs/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | 3 | node_modules 4 | 5 | lib/core/metadata.js 6 | lib/core/MetadataBlog.js 7 | 8 | website/translated_docs 9 | website/build/ 10 | website/yarn.lock 11 | website/node_modules 12 | website/i18n/* 13 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/src/dev/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | import './index.css'; 5 | 6 | ReactDOM.render(, document.getElementById('root')); 7 | -------------------------------------------------------------------------------- /docs/website/sidebars.json: -------------------------------------------------------------------------------- 1 | { 2 | "docs": { 3 | "Getting Started": [ 4 | "getting-started", 5 | "structure", 6 | "scripts", 7 | "projects", 8 | "how-contribute", 9 | "code-of-conduct" 10 | ] 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/utils/resolverPath.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const path = require('path'); 4 | const fs = require('fs'); 5 | 6 | const resolverPath = relativePath => 7 | path.resolve(fs.realpathSync(process.cwd()), relativePath); 8 | 9 | module.exports = resolverPath; 10 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/src/lib/Lib.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Lib = props => ( 4 | 11 | 12 | 13 | ); 14 | 15 | export default App; 16 | -------------------------------------------------------------------------------- /docs/docs/structure.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: structure 3 | title: Structure 4 | sidebar_label: Structure 5 | --- 6 | 7 | File structure generated from the create-react-dependency project 8 | 9 | ``` 10 | my-dependency 11 | ├── README.md 12 | ├── node_modules 13 | ├── package.json 14 | ├── .gitignore 15 | └── src 16 | ├── dev 17 | │ ├── App.js 18 | │ ├── index.css 19 | │ ├── index.html 20 | │ ├── index.js 21 | │ └── logo.png 22 | └── lib 23 | ├── index.cs 24 | ├── index.js 25 | └── Lib.js 26 | ``` 27 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/configs/jest/babelTransform.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const babelJest = require('babel-jest'); 4 | 5 | module.exports = babelJest.createTransformer({ 6 | presets: [ 7 | [require.resolve('@babel/preset-env'), { modules: 'commonjs' }], 8 | [require.resolve('@babel/preset-react'), { absoluteRuntime: false }] 9 | ], 10 | plugins: [ 11 | require.resolve('@babel/plugin-proposal-class-properties'), 12 | require.resolve('@babel/plugin-transform-runtime') 13 | ], 14 | babelrc: false, 15 | configFile: false 16 | }); 17 | -------------------------------------------------------------------------------- /packages/create-react-dependency/stages/createTemplate.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const fs = require('fs'); 4 | const copyFolder = require('../utils/copyFolder'); 5 | 6 | const installTemplate = dir => { 7 | const folder = `${__dirname}/../template`; 8 | try { 9 | fs.copyFileSync(`${folder}/gitignore`, `${dir}/.gitignore`); 10 | fs.copyFileSync(`${folder}/README.md`, `${dir}/README.md`); 11 | copyFolder(`${folder}/src`, `${dir}/src`); 12 | } catch (err) { 13 | console.log(`\x1b[31m${err}\x1b[0m`); 14 | } 15 | }; 16 | 17 | module.exports = installTemplate; 18 | -------------------------------------------------------------------------------- /docs/docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "3" 2 | 3 | services: 4 | docusaurus: 5 | build: . 6 | ports: 7 | - 3000:3000 8 | - 35729:35729 9 | volumes: 10 | - ./docs:/app/docs 11 | - ./website/blog:/app/website/blog 12 | - ./website/core:/app/website/core 13 | - ./website/i18n:/app/website/i18n 14 | - ./website/pages:/app/website/pages 15 | - ./website/static:/app/website/static 16 | - ./website/sidebars.json:/app/website/sidebars.json 17 | - ./website/siteConfig.js:/app/website/siteConfig.js 18 | working_dir: /app/website 19 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/configs/babelConfig.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const babelConfigs = { 4 | presets: [ 5 | '@babel/preset-react', 6 | [ 7 | '@babel/preset-env', 8 | { 9 | exclude: ['proposal-dynamic-import'] 10 | } 11 | ] 12 | ], 13 | plugins: [ 14 | '@babel/plugin-proposal-class-properties', 15 | '@babel/proposal-object-rest-spread', 16 | '@babel/transform-runtime', 17 | [ 18 | 'module-resolver', 19 | { 20 | root: ['./src/lib'] 21 | } 22 | ] 23 | ] 24 | }; 25 | 26 | module.exports = babelConfigs; 27 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "root", 3 | "private": true, 4 | "devDependencies": { 5 | "babel-eslint": "^10.1.0", 6 | "eslint": "^7.1.0", 7 | "eslint-plugin-jsx-a11y": "^6.2.3", 8 | "eslint-plugin-prettier": "^3.1.3", 9 | "eslint-plugin-react": "^7.20.0", 10 | "husky": "^4.2.5", 11 | "lerna": "^3.22.0", 12 | "prettier": "^2.0.5" 13 | }, 14 | "husky": { 15 | "hooks": { 16 | "pre-commit": "yarn lint", 17 | "pre-push": "lerna run test" 18 | } 19 | }, 20 | "scripts": { 21 | "lint": "eslint packages/**/*.js" 22 | }, 23 | "workspaces": [ 24 | "packages/*" 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /packages/create-react-dependency/stages/initializeGit.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const { spawnSync } = require('child_process'); 4 | 5 | const initializeGit = name => { 6 | const originalDirectory = process.cwd(); 7 | 8 | try { 9 | process.chdir(name); 10 | 11 | spawnSync('git', ['init'], { stdio: 'inherit' }); 12 | spawnSync('git', ['add', '*'], { stdio: 'inherit' }); 13 | spawnSync('git', ['commit', '-m', 'First Commit'], { stdio: 'inherit' }); 14 | } catch (err) { 15 | console.log(`\x1b[31m${err}\x1b[0m`); 16 | } 17 | 18 | process.chdir(originalDirectory); 19 | }; 20 | 21 | module.exports = initializeGit; 22 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/utils/deletePath.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const fs = require('fs'); 4 | const path = require('path'); 5 | 6 | const deletePath = pathDelete => { 7 | if (fs.existsSync(pathDelete)) { 8 | const files = fs.readdirSync(pathDelete); 9 | 10 | files.forEach(file => { 11 | const currentPath = path.join(pathDelete, file); 12 | 13 | if (fs.lstatSync(currentPath).isDirectory()) { 14 | deletePath(currentPath); 15 | } else { 16 | fs.unlinkSync(currentPath); 17 | } 18 | }); 19 | 20 | fs.rmdirSync(pathDelete); 21 | } 22 | }; 23 | 24 | module.exports = deletePath; 25 | -------------------------------------------------------------------------------- /packages/create-react-dependency/utils/copyFolder.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const fs = require('fs'); 4 | const path = require('path'); 5 | 6 | const copyFolder = (source, target) => { 7 | if (!fs.existsSync(target)) { 8 | fs.mkdirSync(target); 9 | } 10 | 11 | const files = fs.readdirSync(source); 12 | 13 | files.forEach(file => { 14 | const currentPath = path.join(source, file); 15 | const targePath = path.join(target, file); 16 | 17 | if (fs.lstatSync(currentPath).isDirectory()) { 18 | copyFolder(currentPath, targePath); 19 | } else { 20 | fs.copyFileSync(currentPath, targePath); 21 | } 22 | }); 23 | }; 24 | 25 | module.exports = copyFolder; 26 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/scripts/build-app.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | process.env.NODE_ENV = 'production'; 4 | process.env.BABEL_ENV = 'production'; 5 | 6 | const Webpack = require('webpack'); 7 | const fs = require('fs-extra'); 8 | const resolverPath = require('../utils/resolverPath'); 9 | const configWebpack = require('../configs/webpack.config.js'); 10 | 11 | const BUILD_PATH = resolverPath('build'); 12 | 13 | const config = configWebpack({ 14 | mode: 'production' 15 | }); 16 | 17 | fs.emptyDirSync(BUILD_PATH); 18 | 19 | const compiler = Webpack(config); 20 | 21 | compiler.run((err, stats) => { 22 | if (err) { 23 | return console.log(err); 24 | } 25 | 26 | return console.log(stats); 27 | }); 28 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/README.md: -------------------------------------------------------------------------------- 1 | # My Library - Created from [Create React Dependency](https://github.com/andrelmlins/create-react-dependency) 2 | 3 | ## start the project 4 | 5 | Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`. 6 | 7 | ``` 8 | npm start 9 | // OR 10 | yarn start 11 | ``` 12 | 13 | ## build the project 14 | 15 | Using [babel](https://babeljs.io/) with reference to folder `src/lib`. 16 | 17 | ``` 18 | npm build 19 | // OR 20 | yarn build 21 | ``` 22 | 23 | ## test the project 24 | 25 | Using [jest](https://jestjs.io/) with reference to folder `src/lib`. Is possible edit the test config in `package.json`. 26 | 27 | ``` 28 | npm test 29 | // OR 30 | yarn test 31 | ``` 32 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/utils/readAllFiles.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const fs = require('fs'); 4 | 5 | const readAllFiles = path => { 6 | let files = []; 7 | let filesResult = []; 8 | 9 | try { 10 | files = fs.readdirSync(path); 11 | } catch (e) { 12 | console.log(`Unknown directory: ${path}`); 13 | } 14 | 15 | files.forEach(file => { 16 | if (fs.lstatSync(`${path}/${file}`).isFile()) { 17 | filesResult.push({ name: `${path}/${file}`, isFile: true }); 18 | } else { 19 | filesResult.push({ name: `${path}/${file}`, isFile: false }); 20 | filesResult = filesResult.concat(readAllFiles(`${path}/${file}`)); 21 | } 22 | }); 23 | 24 | return filesResult; 25 | }; 26 | 27 | module.exports = readAllFiles; 28 | -------------------------------------------------------------------------------- /packages/create-react-dependency/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "create-react-dependency", 3 | "version": "1.0.6", 4 | "description": "Creating react libraries", 5 | "main": "index.js", 6 | "author": "André Lins (https://andrelmlins.github.io/)", 7 | "license": "MIT", 8 | "private": false, 9 | "homepage": "https://github.com/andrelmlins/create-react-dependency", 10 | "bin": { 11 | "create-react-dependency": "index.js" 12 | }, 13 | "keywords": [ 14 | "create", 15 | "react", 16 | "dependency" 17 | ], 18 | "repository": { 19 | "type": "git", 20 | "url": "git+https://github.com/andrelmlins/create-react-dependency.git" 21 | }, 22 | "dependencies": { 23 | "commander": "^5.1.0" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/configs/jestConfig.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const jestConfig = { 4 | collectCoverageFrom: ['/src/lib/**/*.{js,jsx}'], 5 | testPathIgnorePatterns: ['/node_modules/', '/dist/'], 6 | transform: { 7 | '^.+\\.(js|jsx|ts|tsx)$': `${__dirname}/jest/babelTransform.js`, 8 | '^.+\\.css$': `${__dirname}/jest/cssTransform.js`, 9 | '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': `${__dirname}/jest/fileTransform.js` 10 | }, 11 | transformIgnorePatterns: [ 12 | '[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$', 13 | '^.+\\.module\\.(css|sass|scss)$' 14 | ], 15 | coverageThreshold: { 16 | global: { 17 | statements: 85, 18 | branches: 85, 19 | lines: 85, 20 | functions: 85 21 | } 22 | } 23 | }; 24 | 25 | module.exports = jestConfig; 26 | -------------------------------------------------------------------------------- /docs/website/static/css/custom.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2017-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | /* your custom css */ 9 | 10 | .homeContainer { 11 | background-color: #37474f; 12 | } 13 | 14 | .homeContainer h2 { 15 | color: white; 16 | } 17 | 18 | .homeContainer a { 19 | color: white; 20 | border-color: white; 21 | } 22 | 23 | @media only screen and (min-device-width: 360px) and (max-device-width: 736px) { 24 | } 25 | 26 | @media only screen and (min-width: 1024px) { 27 | } 28 | 29 | @media only screen and (max-width: 1023px) { 30 | } 31 | 32 | @media only screen and (min-width: 1400px) { 33 | } 34 | 35 | @media only screen and (min-width: 1500px) { 36 | } 37 | -------------------------------------------------------------------------------- /packages/create-react-dependency/stages/installDependencies.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const { execSync } = require('child_process'); 4 | 5 | const yarnInstalled = () => { 6 | try { 7 | execSync('yarnpkg --version', { stdio: 'ignore' }); 8 | return true; 9 | } catch (error) { 10 | return false; 11 | } 12 | }; 13 | 14 | const installDependencies = dir => { 15 | const originalDirectory = process.cwd(); 16 | try { 17 | process.chdir(dir); 18 | 19 | if (yarnInstalled) { 20 | execSync('yarnpkg install', { stdio: 'inherit' }); 21 | } else { 22 | execSync('npm install', { stdio: 'inherit' }); 23 | } 24 | } catch (err) { 25 | console.log(`\x1b[31m${err}\x1b[0m`); 26 | } 27 | 28 | process.chdir(originalDirectory); 29 | }; 30 | 31 | module.exports = installDependencies; 32 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/scripts/test.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | process.env.BABEL_ENV = 'test'; 4 | process.env.NODE_ENV = 'test'; 5 | process.env.PUBLIC_URL = ''; 6 | 7 | process.on('unhandledRejection', err => { 8 | throw err; 9 | }); 10 | 11 | const jest = require('jest'); 12 | const fs = require('fs'); 13 | let jestConfig = require('../configs/jestConfig'); 14 | 15 | const packageJson = JSON.parse(fs.readFileSync('./package.json')); 16 | 17 | if (fs.existsSync('./src/setupTest.js')) { 18 | jestConfig.setupFilesAfterEnv = ['/src/setupTest.js']; 19 | } 20 | 21 | if (packageJson.jest) { 22 | jestConfig = { ...jestConfig, ...packageJson.jest }; 23 | } 24 | 25 | const args = process.argv.slice(2); 26 | args.unshift('--ci'); 27 | args.unshift('--config', JSON.stringify(jestConfig)); 28 | 29 | jest.run(args); 30 | -------------------------------------------------------------------------------- /docs/docs/scripts.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: scripts 3 | title: Scripts 4 | sidebar_label: Scripts 5 | --- 6 | 7 | ## Start the development application 8 | 9 | Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`. 10 | 11 | ``` 12 | npm start 13 | // OR 14 | yarn start 15 | ``` 16 | 17 | ## Build the library 18 | 19 | Using [babel](https://babeljs.io/) with reference to folder `src/lib`. 20 | 21 | ``` 22 | npm build 23 | // OR 24 | yarn build 25 | ``` 26 | 27 | ## Build the development application 28 | 29 | Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`. 30 | 31 | ``` 32 | npm build:app 33 | // OR 34 | yarn build:app 35 | ``` 36 | 37 | ## Test the project 38 | 39 | Using [jest](https://jestjs.io/) with reference to folder `src/lib`. Is possible edit the test config in `package.json`. 40 | 41 | ``` 42 | npm test 43 | // OR 44 | yarn test 45 | ``` 46 | -------------------------------------------------------------------------------- /packages/create-react-dependency/README.md: -------------------------------------------------------------------------------- 1 | # Create React Dependency 2 | 3 | [![npm version](https://badge.fury.io/js/create-react-dependency.svg)](https://www.npmjs.com/package/create-react-dependency) 4 | 5 | ## Basic Use 6 | 7 | ``` 8 | npx create-react-dependency new my-dependency 9 | cd my-dependency 10 | npm start 11 | ``` 12 | 13 | ## How to create a dependency or library? 14 | 15 | ### Yarn 16 | 17 | ``` 18 | yarn create create-react-dependency my-dependency 19 | ``` 20 | 21 | ### NPX 22 | 23 | ``` 24 | npx create-react-dependency my-dependency 25 | ``` 26 | 27 | ### NPM 28 | 29 | ``` 30 | npm init create-react-dependency my-dependency 31 | ``` 32 | 33 | ## NPM Statistics 34 | 35 | Download stats for this NPM package 36 | 37 | [![NPM](https://nodei.co/npm/create-react-dependency.png)](https://nodei.co/npm/create-react-dependency/) 38 | 39 | ## License 40 | 41 | Create React Dependency is open source software [licensed as MIT](https://github.com/andrelmlins/create-react-dependency/blob/master/LICENSE). 42 | -------------------------------------------------------------------------------- /docs/docs/gettingStarted.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: getting-started 3 | title: Getting Started 4 | sidebar_label: Getting Started 5 | --- 6 | 7 | Project similar to the [Create React App](https://github.com/facebook/create-react-app) for libraries and dependencies. 8 | 9 | It creates a ready to publish project which you can upload to npm, yarn and/or your favorite package manager. For more information [click here](https://create-react-dependency.netlify.com/). 10 | 11 | ## Basic Use 12 | 13 | ``` 14 | npx create-react-dependency new my-dependency 15 | cd my-dependency 16 | npm start 17 | ``` 18 | 19 | ## Creating an dependency or library? 20 | 21 | Requires version equal to or later than Node 10, choose from the following options to create a dependency or library: 22 | 23 | ### Yarn 24 | 25 | ``` 26 | yarn create create-react-dependency my-dependency 27 | ``` 28 | 29 | ### NPX 30 | 31 | ``` 32 | npx create-react-dependency my-dependency 33 | ``` 34 | 35 | ### NPM 36 | 37 | ``` 38 | npm init create-react-dependency my-dependency 39 | ``` 40 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/src/dev/index.css: -------------------------------------------------------------------------------- 1 | body, 2 | #root { 3 | margin: 0; 4 | padding: 0; 5 | font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 6 | } 7 | 8 | html, 9 | body, 10 | #root { 11 | width: 100%; 12 | height: 100%; 13 | } 14 | 15 | .content { 16 | background-color: #37474f; 17 | width: 100%; 18 | height: 100%; 19 | display: flex; 20 | align-items: center; 21 | justify-content: center; 22 | flex-direction: column; 23 | } 24 | 25 | .title { 26 | color: #ffd600; 27 | margin-bottom: 80px; 28 | margin-top: 0px; 29 | } 30 | 31 | .logo { 32 | width: auto; 33 | height: 300px; 34 | } 35 | 36 | .library { 37 | width: 600px; 38 | max-width: 100%; 39 | height: 300px; 40 | background-color: white; 41 | display: flex; 42 | align-items: center; 43 | justify-content: center; 44 | overflow: scroll; 45 | border-radius: 5px; 46 | box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 47 | 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2); 48 | } 49 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/index.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | 'use strict'; 4 | 5 | process.on('unhandledRejection', (err) => { 6 | throw err; 7 | }); 8 | 9 | const { spawnSync } = require('child_process'); 10 | 11 | const args = process.argv.slice(2); 12 | const scripts = ['start', 'build', 'test', 'build-app']; 13 | 14 | if (args.length === 0) { 15 | console.log('\x1b[31mEmpty script.'); 16 | process.exit(1); 17 | } 18 | 19 | const script = args[0]; 20 | 21 | console.log(`\x1b[36m\nReact Dependency Scripts (${script})`, '\x1b[0m'); 22 | console.log(`🚀 Version: ${require('./package.json').version}\n`); 23 | 24 | if (scripts.includes(script)) { 25 | const result = spawnSync( 26 | 'node', 27 | [`${__dirname}/scripts/${script}.js`, ...process.argv.slice(3)], 28 | { stdio: 'inherit' } 29 | ); 30 | process.exit(result.status); 31 | } else { 32 | console.log(`\x1b[31mUnknown script ${script}.\x1b[0m`); 33 | console.log('See: http://github.com/andrelmlins/create-react-dependency'); 34 | process.exit(1); 35 | } 36 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/scripts/start.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | process.env.BABEL_ENV = 'development'; 4 | process.env.NODE_ENV = 'development'; 5 | 6 | process.on('unhandledRejection', err => { 7 | throw err; 8 | }); 9 | 10 | const Webpack = require('webpack'); 11 | const WebpackDevServer = require('webpack-dev-server'); 12 | const open = require('open'); 13 | const configWebpack = require('../configs/webpack.config.js'); 14 | const resolverPath = require('../utils/resolverPath'); 15 | const choosePort = require('choose-port'); 16 | 17 | const APP_PATH = resolverPath('src/dev'); 18 | 19 | const config = configWebpack({ 20 | mode: 'development' 21 | }); 22 | 23 | const compiler = Webpack(config); 24 | const server = new WebpackDevServer(compiler, { 25 | contentBase: APP_PATH, 26 | hot: true 27 | }); 28 | 29 | const PORT = process.env.PORT || 3000; 30 | const HOST = process.env.HOST || '127.0.0.1'; 31 | 32 | choosePort(PORT, HOST, newPort => 33 | server.listen(newPort, 'localhost', () => open(`http://localhost:${newPort}`)) 34 | ); 35 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | When contributing to this repository, please first discuss the change you wish to make via issue, 4 | email, or any other method with the owners of this repository before making a change. 5 | 6 | Please note that this project is released with a [Contributor Code of Conduct](CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms. 7 | 8 | ## Pull Request Process 9 | 10 | 1. Ensure any install or build dependencies are removed before the end of the layer when doing a 11 | build. 12 | 2. Update the README.md with details of changes to the interface, this includes new environment 13 | variables, exposed ports, useful file locations and container parameters. 14 | 3. Increase the version numbers in any examples files and the README.md to the new version that this 15 | Pull Request would represent. The versioning scheme we use is [SemVer](http://semver.org/). 16 | 4. You may merge the Pull Request in once you have the sign-off of two other developers, or if you 17 | do not have permission to do that, you may request the second reviewer to merge it for you. 18 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 N.A.D.A. 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 | -------------------------------------------------------------------------------- /docs/docs/projects.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: projects 3 | title: Projects 4 | sidebar_label: Projects 5 | --- 6 | 7 | Create React dependency is a monorepo composed of 2 projects: 8 | 9 | ## Create React Dependency [![npm version](https://badge.fury.io/js/create-react-dependency.svg)](https://www.npmjs.com/package/create-react-dependency) 10 | 11 | The Create React dependency project is a simple CLI that creates a project base for creating a dependency. 12 | 13 | ### Basic Use 14 | 15 | ``` 16 | npx create-react-dependency new my-dependency 17 | cd my-dependency 18 | npm start 19 | ``` 20 | 21 | ## React Dependency Scripts [![npm version](https://badge.fury.io/js/react-dependency-scripts.svg)](https://www.npmjs.com/package/react-dependency-scripts) 22 | 23 | React Dependency Scripts abstracts all the settings needed to create an NPM dependency. Possessing 3 scripts, start with webpack, build with babel and test with jest. 24 | 25 | ### Scripts 26 | 27 | The scripts look like this in the package.json file: 28 | 29 | ```json 30 | { 31 | "scripts": { 32 | "start": "react-dependency-scripts start", 33 | "build": "react-dependency-scripts build", 34 | "test": "react-dependency-scripts test" 35 | } 36 | } 37 | ``` 38 | -------------------------------------------------------------------------------- /docs/docs/howContribute.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: how-contribute 3 | title: How to Contribute 4 | sidebar_label: How to Contribute 5 | --- 6 | 7 | When contributing to this repository, please first discuss the change you wish to make via issue, 8 | email, or any other method with the owners of this repository before making a change. 9 | 10 | Please note that this project is released with a [Contributor Code of Conduct](code-of-conduct). By participating in this project you agree to abide by its terms. 11 | 12 | ## Pull Request Process 13 | 14 | 1. Ensure any install or build dependencies are removed before the end of the layer when doing a 15 | build. 16 | 2. Update the README.md with details of changes to the interface, this includes new environment 17 | variables, exposed ports, useful file locations and container parameters. 18 | 3. Increase the version numbers in any examples files and the README.md to the new version that this 19 | Pull Request would represent. The versioning scheme we use is [SemVer](http://semver.org/). 20 | 4. You may merge the Pull Request in once you have the sign-off of two other developers, or if you 21 | do not have permission to do that, you may request the second reviewer to merge it for you. 22 | -------------------------------------------------------------------------------- /packages/create-react-dependency/stages/createPackageJson.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const fs = require('fs'); 4 | const path = require('path'); 5 | 6 | const createPackageJson = (root, name) => { 7 | const basePackageJson = { 8 | name: name, 9 | version: '0.0.1', 10 | main: 'dist/index.js', 11 | module: 'dist/index.js', 12 | license: 'MIT', 13 | files: ['dist'], 14 | scripts: { 15 | start: 'react-dependency-scripts start', 16 | build: 'react-dependency-scripts build', 17 | 'build:app': 'react-dependency-scripts build-app', 18 | test: 'react-dependency-scripts test', 19 | }, 20 | devDependencies: { 21 | react: '^16.13.0', 22 | 'react-dom': '^16.13.0', 23 | 'react-dependency-scripts': '^1.0.6', 24 | }, 25 | browserslist: { 26 | production: ['>0.2%', 'not dead', 'not op_mini all'], 27 | development: [ 28 | 'last 1 chrome version', 29 | 'last 1 firefox version', 30 | 'last 1 safari version', 31 | ], 32 | }, 33 | }; 34 | 35 | fs.writeFileSync( 36 | path.join(root, 'package.json'), 37 | JSON.stringify(basePackageJson, null, 2) 38 | ); 39 | }; 40 | 41 | module.exports = createPackageJson; 42 | -------------------------------------------------------------------------------- /packages/create-react-dependency/template/gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /bower_componets 6 | /.pnp 7 | .pnp.js 8 | 9 | # TypeScript v1 declaration files 10 | typings/ 11 | 12 | # TypeScript cache 13 | *.tsbuildinfo 14 | 15 | # Optional npm cache directory 16 | .npm 17 | 18 | # Optional eslint cache 19 | .eslintcache 20 | 21 | # Optional REPL history 22 | .node_repl_history 23 | 24 | # Output of 'npm pack' 25 | *.tgz 26 | 27 | # Yarn Integrity file 28 | .yarn-integrity 29 | 30 | # testing 31 | /coverage 32 | 33 | # production 34 | /dist 35 | 36 | # next.js build output 37 | .next 38 | 39 | # dotenv environment variables file 40 | .env 41 | .env.test 42 | 43 | # misc 44 | .DS_* 45 | **/*.backup.* 46 | **/*.back.* 47 | .env.local 48 | .env.development.local 49 | .env.test.local 50 | .env.production.local 51 | 52 | # Logs 53 | logs 54 | *.log 55 | npm-debug.log* 56 | yarn-debug.log* 57 | yarn-error.log* 58 | lerna-debug.log* 59 | 60 | # Runtime data 61 | pids 62 | *.pid 63 | *.seed 64 | *.pid.lock 65 | 66 | # DynamoDB Local files 67 | .dynamodb/ 68 | 69 | # FuseBox cache 70 | .fusebox/ 71 | 72 | # parcel-bundler cache (https://parceljs.org/) 73 | .cache 74 | 75 | # Other 76 | .idea/ 77 | *.sublime* 78 | psd 79 | thumb 80 | sketch 81 | Thumbs.db -------------------------------------------------------------------------------- /packages/react-dependency-scripts/README.md: -------------------------------------------------------------------------------- 1 | # React Dependency Scripts 2 | 3 | [![npm version](https://badge.fury.io/js/react-dependency-scripts.svg)](https://www.npmjs.com/package/react-dependency-scripts) 4 | 5 | ## Start the development application 6 | 7 | Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`. 8 | 9 | ``` 10 | npm start 11 | // OR 12 | yarn start 13 | ``` 14 | 15 | ## Build the library 16 | 17 | Using [babel](https://babeljs.io/) with reference to folder `src/lib`. 18 | 19 | ``` 20 | npm build 21 | // OR 22 | yarn build 23 | ``` 24 | 25 | ## Build the development application 26 | 27 | Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`. 28 | 29 | ``` 30 | npm build:app 31 | // OR 32 | yarn build:app 33 | ``` 34 | 35 | ## Test the project 36 | 37 | Using [jest](https://jestjs.io/) with reference to folder `src/lib`. Is possible edit the test config in `package.json`. 38 | 39 | ``` 40 | npm test 41 | // OR 42 | yarn test 43 | ``` 44 | 45 | ## NPM Statistics 46 | 47 | Download stats for this NPM package 48 | 49 | [![NPM](https://nodei.co/npm/react-dependency-scripts.png)](https://nodei.co/npm/react-dependency-scripts/) 50 | 51 | ## License 52 | 53 | Create React Dependency is open source software [licensed as MIT](https://github.com/andrelmlins/create-react-dependency/blob/master/LICENSE). 54 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["plugin:react/recommended", "plugin:jsx-a11y/recommended"], 3 | "settings": { 4 | "react": { 5 | "pragma": "React", 6 | "version": "16.4.1" 7 | } 8 | }, 9 | "plugins": ["react", "jsx-a11y", "prettier"], 10 | "env": { 11 | "browser": true 12 | }, 13 | "rules": { 14 | "curly": ["error", "all"], 15 | "react/jsx-curly-brace-presence": "error", 16 | "react/display-name": "off", 17 | "react/jsx-uses-react": "error", 18 | "react/jsx-uses-vars": "error", 19 | "react/no-deprecated": "off", 20 | "react/prop-types": "off", 21 | "react/no-unescaped-entities": "off", 22 | "import/prop-types": "off", 23 | "import/no-extraneous-dependencies": "off", 24 | "import/prefer-default-export": "off", 25 | "import/no-unresolved": "off", 26 | "import/extensions": "off", 27 | "indent": [ 28 | "error", 29 | 2, 30 | { 31 | "SwitchCase": 1 32 | } 33 | ], 34 | "id-length": 0, 35 | "semi": ["error", "always"], 36 | "quotes": [1, "single"], 37 | "object-curly-spacing": ["error", "always"], 38 | "jsx-quotes": ["error", "prefer-double"], 39 | "avoidEscape": "off", 40 | "prettier/prettier": "error" 41 | }, 42 | "parser": "babel-eslint", 43 | "parserOptions": { 44 | "ecmaFeatures": { 45 | "jsx": true 46 | } 47 | }, 48 | "globals": { 49 | "Event": true 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/configs/jest/fileTransform.js: -------------------------------------------------------------------------------- 1 | // Copied from Create React APP 2 | 3 | 'use strict'; 4 | 5 | const path = require('path'); 6 | const camelcase = require('camelcase'); 7 | 8 | // This is a custom Jest transformer turning file imports into filenames. 9 | // http://facebook.github.io/jest/docs/en/webpack.html 10 | 11 | module.exports = { 12 | process(src, filename) { 13 | const assetFilename = JSON.stringify(path.basename(filename)); 14 | 15 | if (filename.match(/\.svg$/)) { 16 | // Based on how SVGR generates a component name: 17 | // https://github.com/smooth-code/svgr/blob/01b194cf967347d43d4cbe6b434404731b87cf27/packages/core/src/state.js#L6 18 | const pascalCaseFileName = camelcase(path.parse(filename).name, { 19 | pascalCase: true 20 | }); 21 | const componentName = `Svg${pascalCaseFileName}`; 22 | return `const React = require('react'); 23 | module.exports = { 24 | __esModule: true, 25 | default: ${assetFilename}, 26 | ReactComponent: React.forwardRef(function ${componentName}(props, ref) { 27 | return { 28 | $$typeof: Symbol.for('react.element'), 29 | type: 'svg', 30 | ref: ref, 31 | key: null, 32 | props: Object.assign({}, props, { 33 | children: ${assetFilename} 34 | }) 35 | }; 36 | }), 37 | };`; 38 | } 39 | 40 | return `module.exports = ${assetFilename};`; 41 | } 42 | }; 43 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/scripts/build.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | process.env.NODE_ENV = 'production'; 4 | process.env.BABEL_ENV = 'production'; 5 | 6 | process.on('unhandledRejection', (err) => { 7 | throw err; 8 | }); 9 | 10 | const babel = require('@babel/core'); 11 | const fs = require('fs'); 12 | const readAllFiles = require('../utils/readAllFiles'); 13 | const deletePath = require('../utils/deletePath'); 14 | const resolverPath = require('../utils/resolverPath'); 15 | const babelConfig = require('../configs/babelConfig'); 16 | 17 | process.on('unhandledRejection', (err) => { 18 | throw err; 19 | }); 20 | 21 | const APP_PATH = resolverPath('src/lib'); 22 | const BUILD_PATH = resolverPath('dist'); 23 | 24 | deletePath(BUILD_PATH); 25 | fs.mkdirSync(BUILD_PATH); 26 | console.log(`Create directory:\t${BUILD_PATH}`); 27 | 28 | const files = readAllFiles(APP_PATH); 29 | 30 | files.map((path) => { 31 | const newPath = path.name.replace(APP_PATH, BUILD_PATH); 32 | if (path.isFile) { 33 | if ( 34 | path.name.match('^.+\\.(js|jsx|ts|tsx)$') && 35 | !path.name.match('^.+\\.d.ts$') 36 | ) { 37 | const result = babel.transformFileSync(path.name, babelConfig); 38 | fs.appendFileSync(newPath, result.code); 39 | } else { 40 | fs.appendFileSync(newPath, fs.readFileSync(path.name)); 41 | } 42 | 43 | console.log('\x1b[32m', `Create file:\t\t${newPath}`, '\x1b[0m'); 44 | } else { 45 | fs.mkdirSync(newPath); 46 | 47 | console.log(`Create directory:\t${newPath}`); 48 | } 49 | }); 50 | -------------------------------------------------------------------------------- /packages/create-react-dependency/index.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | 'use strict'; 4 | 5 | const program = require('commander'); 6 | const path = require('path'); 7 | const fs = require('fs'); 8 | const createPackageJson = require('./stages/createPackageJson'); 9 | const createTemplate = require('./stages/createTemplate'); 10 | const installDependencies = require('./stages/installDependencies'); 11 | const initializeGit = require('./stages/initializeGit'); 12 | 13 | console.log('\x1b[36mCreate React Dependency', '\x1b[0m'); 14 | console.log(`🚀 Version: ${require('./package.json').version}\n`); 15 | 16 | let projectName; 17 | 18 | program 19 | .version(require('./package.json').version, '-v --version', 'Version number') 20 | .helpOption('-h --help', 'For more information'); 21 | 22 | program 23 | .name(`${require('./package.json').name} new`) 24 | .command('new ') 25 | .description('Create a new project') 26 | .action((name) => (projectName = name)); 27 | 28 | program.parse(process.argv); 29 | 30 | if (typeof projectName === 'undefined') { 31 | console.error('\x1b[31mSpecify the name project.', '\x1b[0m'); 32 | console.log(` For example: ${program.name()} my-dependencie`); 33 | console.log(` Run ${program.name()} --help for more information\n`); 34 | 35 | process.exit(1); 36 | } else { 37 | const root = path.resolve(projectName); 38 | 39 | fs.mkdirSync(projectName); 40 | createPackageJson(root, projectName); 41 | createTemplate(root); 42 | installDependencies(root); 43 | initializeGit(root); 44 | } 45 | -------------------------------------------------------------------------------- /docs/website/pages/en/users.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2017-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | const React = require('react'); 9 | 10 | const CompLibrary = require('../../core/CompLibrary.js'); 11 | 12 | const Container = CompLibrary.Container; 13 | 14 | class Users extends React.Component { 15 | render() { 16 | const {config: siteConfig} = this.props; 17 | if ((siteConfig.users || []).length === 0) { 18 | return null; 19 | } 20 | 21 | const editUrl = `${siteConfig.repoUrl}/edit/master/website/siteConfig.js`; 22 | const showcase = siteConfig.users.map(user => ( 23 | 24 | {user.caption} 25 | 26 | )); 27 | 28 | return ( 29 |
30 | 31 |
32 |
33 |

Who is Using This?

34 |

This project is used by many folks

35 |
36 |
{showcase}
37 |

Are you using this project?

38 | 39 | Add your company 40 | 41 |
42 | 43 |
44 | ); 45 | } 46 | } 47 | 48 | module.exports = Users; 49 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-dependency-scripts", 3 | "version": "1.0.6", 4 | "description": "Scripts of react libraries", 5 | "main": "index.js", 6 | "author": "André Lins (https://andrelmlins.github.io/)", 7 | "license": "MIT", 8 | "private": false, 9 | "homepage": "https://github.com/andrelmlins/create-react-dependency", 10 | "bin": { 11 | "react-dependency-scripts": "index.js" 12 | }, 13 | "keywords": [ 14 | "react", 15 | "dependency", 16 | "scripts" 17 | ], 18 | "repository": { 19 | "type": "git", 20 | "url": "git+https://github.com/andrelmlins/create-react-dependency.git" 21 | }, 22 | "peerDependencies": { 23 | "react": "^16.9.0", 24 | "react-dom": "^16.9.0" 25 | }, 26 | "dependencies": { 27 | "@babel/core": "^7.9.6", 28 | "@babel/plugin-proposal-class-properties": "^7.8.3", 29 | "@babel/plugin-transform-runtime": "^7.9.6", 30 | "@babel/preset-env": "^7.9.6", 31 | "@babel/preset-react": "^7.9.4", 32 | "babel-jest": "^25.2.6", 33 | "babel-loader": "^8.1.0", 34 | "babel-plugin-module-resolver": "^4.0.0", 35 | "babel-preset-react-app": "^9.1.2", 36 | "choose-port": "^0.2.0", 37 | "css-loader": "^3.5.3", 38 | "file-loader": "^6.0.0", 39 | "fs-extra": "^9.0.0", 40 | "html-webpack-plugin": "^4.3.0", 41 | "image-webpack-loader": "^6.0.0", 42 | "jest": "^25.2.6", 43 | "open": "^7.0.4", 44 | "sass-loader": "^8.0.2", 45 | "style-loader": "^1.2.1", 46 | "variables-loader": "^1.0.0", 47 | "webpack": "^4.43.0", 48 | "webpack-dev-server": "^3.11.0" 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /docs/website/pages/en/help.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2017-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | const React = require('react'); 9 | 10 | const CompLibrary = require('../../core/CompLibrary.js'); 11 | 12 | const Container = CompLibrary.Container; 13 | const GridBlock = CompLibrary.GridBlock; 14 | 15 | function Help(props) { 16 | const {config: siteConfig, language = ''} = props; 17 | const {baseUrl, docsUrl} = siteConfig; 18 | const docsPart = `${docsUrl ? `${docsUrl}/` : ''}`; 19 | const langPart = `${language ? `${language}/` : ''}`; 20 | const docUrl = doc => `${baseUrl}${docsPart}${langPart}${doc}`; 21 | 22 | const supportLinks = [ 23 | { 24 | content: `Learn more using the [documentation on this site.](${docUrl( 25 | 'doc1.html', 26 | )})`, 27 | title: 'Browse Docs', 28 | }, 29 | { 30 | content: 'Ask questions about the documentation and project', 31 | title: 'Join the community', 32 | }, 33 | { 34 | content: "Find out what's new with this project", 35 | title: 'Stay up to date', 36 | }, 37 | ]; 38 | 39 | return ( 40 |
41 | 42 |
43 |
44 |

Need help?

45 |
46 |

This project is maintained by a dedicated group of people.

47 | 48 |
49 | 50 |
51 | ); 52 | } 53 | 54 | module.exports = Help; 55 | -------------------------------------------------------------------------------- /packages/react-dependency-scripts/configs/webpack.config.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 4 | const resolverPath = require('../utils/resolverPath'); 5 | 6 | const APP_PATH = resolverPath('src/dev'); 7 | const BUILD_PATH = resolverPath('build'); 8 | 9 | const configWebpack = ({ mode }) => { 10 | const isEnvProduction = mode === 'production'; 11 | 12 | return { 13 | entry: APP_PATH, 14 | output: { 15 | path: BUILD_PATH, 16 | pathinfo: !isEnvProduction, 17 | filename: isEnvProduction 18 | ? 'static/js/[name].[contenthash:8].js' 19 | : 'bundle.js', 20 | chunkFilename: isEnvProduction 21 | ? 'static/js/[name].[contenthash:8].chunk.js' 22 | : 'static/js/[name].chunk.js', 23 | globalObject: 'this' 24 | }, 25 | mode, 26 | bail: isEnvProduction, 27 | resolve: { 28 | modules: [ 29 | 'node_modules', 30 | resolverPath('node_modules'), 31 | resolverPath('src') 32 | ], 33 | extensions: ['.ts', '.tsx', '.js', '.json'] 34 | }, 35 | module: { 36 | rules: [ 37 | { 38 | test: /\.(ts|js)x?$/, 39 | loader: require.resolve('babel-loader'), 40 | exclude: /node_modules/, 41 | options: { 42 | babelrc: false, 43 | configFile: false, 44 | compact: isEnvProduction, 45 | sourceMaps: false, 46 | inputSourceMap: false, 47 | presets: [require.resolve('babel-preset-react-app')] 48 | } 49 | }, 50 | { 51 | test: /\.(ts|js)x?$/, 52 | use: ['variables-loader'] 53 | }, 54 | { 55 | test: /\.(gif|png|jpe?g|svg)$/i, 56 | use: ['file-loader', { loader: 'image-webpack-loader' }] 57 | }, 58 | { 59 | test: /\.scss$/, 60 | use: ['style-loader', 'css-loader', 'sass-loader'] 61 | }, 62 | { 63 | test: /\.css$/, 64 | use: ['style-loader', 'css-loader'] 65 | } 66 | ] 67 | }, 68 | optimization: { minimize: isEnvProduction }, 69 | node: { 70 | module: 'empty', 71 | dgram: 'empty', 72 | dns: 'mock', 73 | fs: 'empty', 74 | http2: 'empty', 75 | net: 'empty', 76 | tls: 'empty', 77 | child_process: 'empty' 78 | }, 79 | plugins: [ 80 | new HtmlWebpackPlugin( 81 | Object.assign( 82 | {}, 83 | { inject: true, template: `${APP_PATH}/index.html` }, 84 | isEnvProduction 85 | ? { 86 | minify: { 87 | removeComments: true, 88 | collapseWhitespace: true, 89 | removeRedundantAttributes: true, 90 | useShortDoctype: true, 91 | removeEmptyAttributes: true, 92 | removeStyleLinkTypeAttributes: true, 93 | keepClosingSlash: true, 94 | minifyJS: true, 95 | minifyCSS: true, 96 | minifyURLs: true 97 | } 98 | } 99 | : undefined 100 | ) 101 | ) 102 | ] 103 | }; 104 | }; 105 | 106 | module.exports = configWebpack; 107 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as 6 | contributors and maintainers pledge to making participation in our project and 7 | our community a harassment-free experience for everyone, regardless of age, body 8 | size, disability, ethnicity, sex characteristics, gender identity and expression, 9 | level of experience, education, socio-economic status, nationality, personal 10 | appearance, race, religion, or sexual identity and orientation. 11 | 12 | ## Our Standards 13 | 14 | Examples of behavior that contributes to creating a positive environment 15 | include: 16 | 17 | * Using welcoming and inclusive language 18 | * Being respectful of differing viewpoints and experiences 19 | * Gracefully accepting constructive criticism 20 | * Focusing on what is best for the community 21 | * Showing empathy towards other community members 22 | 23 | Examples of unacceptable behavior by participants include: 24 | 25 | * The use of sexualized language or imagery and unwelcome sexual attention or 26 | advances 27 | * Trolling, insulting/derogatory comments, and personal or political attacks 28 | * Public or private harassment 29 | * Publishing others' private information, such as a physical or electronic 30 | address, without explicit permission 31 | * Other conduct which could reasonably be considered inappropriate in a 32 | professional setting 33 | 34 | ## Our Responsibilities 35 | 36 | Project maintainers are responsible for clarifying the standards of acceptable 37 | behavior and are expected to take appropriate and fair corrective action in 38 | response to any instances of unacceptable behavior. 39 | 40 | Project maintainers have the right and responsibility to remove, edit, or 41 | reject comments, commits, code, wiki edits, issues, and other contributions 42 | that are not aligned to this Code of Conduct, or to ban temporarily or 43 | permanently any contributor for other behaviors that they deem inappropriate, 44 | threatening, offensive, or harmful. 45 | 46 | ## Scope 47 | 48 | This Code of Conduct applies both within project spaces and in public spaces 49 | when an individual is representing the project or its community. Examples of 50 | representing a project or community include using an official project e-mail 51 | address, posting via an official social media account, or acting as an appointed 52 | representative at an online or offline event. Representation of a project may be 53 | further defined and clarified by project maintainers. 54 | 55 | ## Enforcement 56 | 57 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 58 | reported by contacting the project team at andrelucas01@hotmail.com. All 59 | complaints will be reviewed and investigated and will result in a response that 60 | is deemed necessary and appropriate to the circumstances. The project team is 61 | obligated to maintain confidentiality with regard to the reporter of an incident. 62 | Further details of specific enforcement policies may be posted separately. 63 | 64 | Project maintainers who do not follow or enforce the Code of Conduct in good 65 | faith may face temporary or permanent repercussions as determined by other 66 | members of the project's leadership. 67 | 68 | ## Attribution 69 | 70 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 71 | available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html 72 | 73 | [homepage]: https://www.contributor-covenant.org 74 | 75 | For answers to common questions about this code of conduct, see 76 | https://www.contributor-covenant.org/faq 77 | -------------------------------------------------------------------------------- /docs/docs/codeConduct.md: -------------------------------------------------------------------------------- 1 | --- 2 | id: code-of-conduct 3 | title: Code of Conduct 4 | sidebar_label: Code of Conduct 5 | --- 6 | 7 | ## Our Pledge 8 | 9 | In the interest of fostering an open and welcoming environment, we as 10 | contributors and maintainers pledge to making participation in our project and 11 | our community a harassment-free experience for everyone, regardless of age, body 12 | size, disability, ethnicity, sex characteristics, gender identity and expression, 13 | level of experience, education, socio-economic status, nationality, personal 14 | appearance, race, religion, or sexual identity and orientation. 15 | 16 | ## Our Standards 17 | 18 | Examples of behavior that contributes to creating a positive environment 19 | include: 20 | 21 | - Using welcoming and inclusive language 22 | - Being respectful of differing viewpoints and experiences 23 | - Gracefully accepting constructive criticism 24 | - Focusing on what is best for the community 25 | - Showing empathy towards other community members 26 | 27 | Examples of unacceptable behavior by participants include: 28 | 29 | - The use of sexualized language or imagery and unwelcome sexual attention or 30 | advances 31 | - Trolling, insulting/derogatory comments, and personal or political attacks 32 | - Public or private harassment 33 | - Publishing others' private information, such as a physical or electronic 34 | address, without explicit permission 35 | - Other conduct which could reasonably be considered inappropriate in a 36 | professional setting 37 | 38 | ## Our Responsibilities 39 | 40 | Project maintainers are responsible for clarifying the standards of acceptable 41 | behavior and are expected to take appropriate and fair corrective action in 42 | response to any instances of unacceptable behavior. 43 | 44 | Project maintainers have the right and responsibility to remove, edit, or 45 | reject comments, commits, code, wiki edits, issues, and other contributions 46 | that are not aligned to this Code of Conduct, or to ban temporarily or 47 | permanently any contributor for other behaviors that they deem inappropriate, 48 | threatening, offensive, or harmful. 49 | 50 | ## Scope 51 | 52 | This Code of Conduct applies both within project spaces and in public spaces 53 | when an individual is representing the project or its community. Examples of 54 | representing a project or community include using an official project e-mail 55 | address, posting via an official social media account, or acting as an appointed 56 | representative at an online or offline event. Representation of a project may be 57 | further defined and clarified by project maintainers. 58 | 59 | ## Enforcement 60 | 61 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 62 | reported by contacting the project team at andrelucas01@hotmail.com. All 63 | complaints will be reviewed and investigated and will result in a response that 64 | is deemed necessary and appropriate to the circumstances. The project team is 65 | obligated to maintain confidentiality with regard to the reporter of an incident. 66 | Further details of specific enforcement policies may be posted separately. 67 | 68 | Project maintainers who do not follow or enforce the Code of Conduct in good 69 | faith may face temporary or permanent repercussions as determined by other 70 | members of the project's leadership. 71 | 72 | ## Attribution 73 | 74 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 75 | available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html 76 | 77 | [homepage]: https://www.contributor-covenant.org 78 | 79 | For answers to common questions about this code of conduct, see 80 | https://www.contributor-covenant.org/faq 81 | -------------------------------------------------------------------------------- /docs/website/siteConfig.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2017-present, Facebook, Inc. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | // See https://docusaurus.io/docs/site-config for all the possible 9 | // site configuration options. 10 | 11 | // List of projects/orgs using your project for the users page. 12 | const users = [ 13 | { 14 | caption: 'User1', 15 | // You will need to prepend the image path with your baseUrl 16 | // if it is not '/', like: '/test-site/img/image.jpg'. 17 | image: '/img/undraw_open_source.svg', 18 | infoLink: 'https://www.facebook.com', 19 | pinned: true 20 | } 21 | ]; 22 | 23 | const siteConfig = { 24 | title: 'Create React Dependency', // Title for your website. 25 | tagline: 26 | 'Project similar to the Create React App for libraries and dependencies', 27 | url: 'https://create-react-dependency.netlify.com/', // Your website URL 28 | baseUrl: '/', // Base URL for your project */ 29 | // For github.io type URLs, you would set the url and baseUrl like: 30 | // url: 'https://facebook.github.io', 31 | // baseUrl: '/test-site/', 32 | 33 | // Used for publishing and more 34 | projectName: 'create-react-dependency', 35 | organizationName: 'facebook', 36 | // For top-level user or org sites, the organization is still the same. 37 | // e.g., for the https://JoelMarcey.github.io site, it would be set like... 38 | // organizationName: 'JoelMarcey' 39 | 40 | // For no header links in the top nav bar -> headerLinks: [], 41 | headerLinks: [ 42 | { doc: 'getting-started', label: 'Docs' }, 43 | { doc: 'how-contribute', label: 'Contributing' }, 44 | { page: 'help', label: 'Help' } 45 | ], 46 | 47 | // If you have users set above, you add it here: 48 | users, 49 | 50 | /* path to images for header/footer */ 51 | headerIcon: 'img/favicon.ico', 52 | footerIcon: 'img/favicon.ico', 53 | favicon: 'img/favicon.ico', 54 | 55 | /* Colors for website */ 56 | colors: { 57 | primaryColor: '#263238', 58 | secondaryColor: '#37474f' 59 | }, 60 | 61 | /* Custom fonts for website */ 62 | /* 63 | fonts: { 64 | myFont: [ 65 | "Times New Roman", 66 | "Serif" 67 | ], 68 | myOtherFont: [ 69 | "-apple-system", 70 | "system-ui" 71 | ] 72 | }, 73 | */ 74 | 75 | // This copyright info is used in /core/Footer.js and blog RSS/Atom feeds. 76 | copyright: `Copyright © ${new Date().getFullYear()} N.A.D.A.`, 77 | 78 | highlight: { 79 | // Highlight.js theme to use for syntax highlighting in code blocks. 80 | theme: 'default' 81 | }, 82 | 83 | // Add custom scripts here that would be placed in