wx-chevalier / web-examples Goto Github PK

Lucid & Futuristic Production Boilerplates For Frontend(Web) Apps, React/RN/Vue, with TypeScript(Optional), Webpack 4/Parcel, MobX/Redux :dizzy: 多技术栈前端项目模板

Home Page: https://ng-tech.icu/

License: MIT License

JavaScript 62.24% HTML 4.17% CSS 2.91% Vue 1.85% TypeScript 19.46% Java 0.16% Objective-C 0.43% Ruby 0.15% Dart 1.22% Rust 0.10% Starlark 0.13% EJS 1.19% SCSS 3.25% Svelte 0.49% Less 0.75% Shell 0.05% C 0.19% Go 0.40% C++ 0.86%

webpack2 redux react boilerplate webpack mobx wx-code wx-fe

web-examples's Introduction

点击前往 NGTE Books Online, 在线阅读数万篇编程笔记

在这个知识大爆发的时代，笔者所见许多人面临的问题不再是知识的匮乏，也不是缺乏学习的动力、毅力或激情，而是在浩汤洪流之中迷失了方向，也无足够的承载知识的容器，终致学的越多，忘的越多，竹篮打水一场空。某熊的技术之路系列文章、书籍、视频、代码、项目即是笔者为自己构建的知识围栏，纳知识与己内；也是笔者蹒跚行进于这条路上的点滴印记，包含了笔者作为程序员的技术视野、知识管理与职业规划，致力于提升开发者的学习效率与实际研发效能。

NGTE 意为 Next-generation Technology Education，聊表笔者面向未来，徜徉星海之念；笔者目前的沉淀分为两大系列：编程笔记与代码实践。

编程笔记

编程笔记系列，已有数十仓库千篇文章百万字：

知识体系：《Awesome Lists | CS 资料集锦》、《Awesome CheatSheets | 速学速查手册》、《Awesome Interviews | 求职面试必备》、《Awesome RoadMaps | 程序员进阶指南》、《Awesome MindMaps | 知识脉络思维脑图》、《Awesome-CS-Books | 开源书籍（.pdf）汇总》
编程语言：《编程语言理论》、《Java 实战、《JavaScript 实战》、《Go 实战》、《Python 实战》、《Rust 实战》
软件工程、模式与架构：《编程范式与设计模式》、《数据结构与算法》、《软件架构设计》、《整洁与重构》、《协作与项目管理》》

Web 与大前端：《现代 Web 全栈开发与工程架构》、《数据可视化、《iOS》、《Android》、《混合开发与跨端应用》、《Node.js 全栈开发》
服务端开发实践与工程架构：《服务端功能域》、《微服务与云原生、《测试与高可用保障》、《DevOps》、《Spring》、《信息安全与渗透测试》
分布式基础架构：《分布式系统》、《分布式计算》、《数据库》、《网络》、《虚拟化与云计算》、《Linux 与操作系统》
数据科学，人工智能与深度学习：《数理统计》、《数据分析、《机器学习》、《深度学习、《自然语言处理》、《工具与工程化》、《行业应用》
产品设计与用户体验：《产品设计》、《交互体验、《项目管理》
行业应用：《行业迷思》、《功能域》、《电子商务、《智能制造》

此外，你还可前往 NGTE Website 交互式地检索、查找需要的文章/链接/书籍/课程；或者也可以关注微信公众号：某熊的技术之路以获取最新资讯。

代码实践

对应于笔者的知识体系，也为了更好地进行管理协作，笔者将数十个仓库划分到了包含脚手架、前端、后端、基础架构等不同的系列中，可以直接按照标签/前缀检索。

*-examples 系列: 文档关联的代码案例
dd-* 系列: Development & Docs，笔者的开发与文档编写系列项目。

大前端系列

m-fe-* 系列: 微前端工程化系统项目，包含了前端开发基础脚手架、React/Vue/Node/Electron/Taro 以及各种微前端模板。
fractal-components 系列：包含 Web 电子白板、Excel 全栈解决方案等一系列项目。
3d-* 系列: 3D 模型在线预览、处理等系列项目。
ueme-* 系列: 构建用户体验中台系列项目。

后端与应用系列

ms-* 系列: 构建微服务&云原生应用的一系列项目。
reinvent-* 系列: 一系列从零开始实现分布式系统、数据库、微服务框架等。
memi-* 系列: 构建业务中台的一系列项目，包含了跨领域 Schema 定义等。
sentinel-* 系列: 信息安全与渗透测试相关项目，包含了分布式扫描器、异构爬虫等。

AI 与算法系列

ai-* 系列: 人工智能与算法相关一系列项目。

About Me

web-examples's People

Contributors

Stargazers

Watchers

Forkers

szwork2013 stonewl897 kocokolo lanchunlei yanggen whisperfairy talkvip jiapengdeng jakexu linkz-ifelse zhangzhenfei chengyuzhang foamfish nalantianyi yun99 cruiseliugit reckyhsu gonmedtara tongdada githbq liang869219658 tongxunlu 7256 hdfs010 tach0932 zhangwei5095 fangtoby fashtimedotcom redtmp liangklfang dmpx imac8t diguanianzhu manpenghui zhangxr2 shawsam ghty826 hevin-lee cqm1994617 jason0307 sqliang blet mingneo chaoming-l yangshuting jiaojiao085 squallyan alucardhyx aguu125 zhujinxuan rpdg changriver xinxinq cuitymiko stragiht domyhero zwlzwt linxq milo-wjh horistardust wlqpower chenrui2014 cxf0505 duyunqiang huangwencun newtonguo catepillarzyc lazzman vincentpanqi small-inn reganan umphp smilemilk jarvis99 web-es6 programmingaworld valsun2016 dull-looking ahopes donaldjohn zdq1111 amtech viyozc koalahui superliuwr haili007 visionwang smile2049 cloneothersproject liulvjianisawesome gravitymsc kun368 resilientred cheng-shiqi wendyandjken czb128abc kevoner zhangxvx hahacoo sweetymeow

web-examples's Issues

请教下entry和output怎么对应的

如题，我查阅各种资料，都说output的js文件名和entry是一一对应的。但是这个脚手架里的配置中，开发模式下，entry是个数组，output用的是[name].bundle.js，但最终文件却是main.bundile.js和vendor.bundle.js，这是怎么回事？到底是哪里配置出来的？
我想将这个项目https://github.com/react-cosmos整合进工程中，但疑似因为index.html和bundle.js的原因杯具了

Remove react related content in vue's README.md

Hello, thanks to offer such nice boilerplate for Vue(also, react)! But there's seem to be some react related content in vue/README.md, I'm not think it's useful for a Vue boilerplate.

Cannot find module 'prepack'

复制步骤是：

平台：macOS Sierra
下载源码
cd ./vue
yarn install
npm start
出现： Cannot find module 'prepack'

请问：这个怎么解决？

better-npm-run报错

better-npm-run 不是内部或者外部命令，也不是可运行程序
在install后出现的报错

webpack-ts项目，script配置有误

其中："dev": "parallelshell \"npm run mock\" \"npm run dev\""

SASS Module

Please add typings-for-css-modules-loader plugin to /react/webpack-ts.To support the flow example:
import style from '/**/.sass'.
otherwise it doesn't work to use css module when build the production.
or i need to write the *.d.ts manually.
Thanks.

autoprefixer 貌似没有效果

机器 mac

react-ts-webpack 如何启动

请问 react-ts-webpack 这个项目如何在本地启动，我能单独启动 host 或者子 app，但是不知道怎么把整套微前端系统启动起来

windows平台的install.bat都是错

疑似直接把sh换了个后缀~
首先换行符得换成windows的，其次注释语法是错的，导致没有一条命令可以运行。最后第一行那个在windows上不只是不起作用，还会报错。
还有个问题可能也会影响其他平台。最开始用npm安装yarn，官方已经废弃的，官方推荐直接用安装包管理器下载安装，或者在windows平台上直接下个msi安装包安装。我的情况是我已经用msi安装了2.3版本的，用了这个install，再次用npm安装了2.2版本的。我也不知道会不会有什么副作用，所以手动用npm卸载了npm内部的yarn

我安装systemjs之后require报错（找不到模块）

ERROR in ./~/systemjs/dist/system.src.js
Module not found: Error: Can't resolve 'fs' in '/Applications/XAMPP/xamppfiles/htdocs/woeks/20161115/SmartAnalysis/node_modules/systemjs/dist'
 @ ./~/systemjs/dist/system.src.js 1492:13-26
 @ ./js/src/Unique_main.jsx
 @ multi webpack-dev-server/client?http://127.0.0.1:3001 webpack/hot/dev-server ./js/src/Unique_main.jsx
Child html-webpack-plugin for "index.html":
         Asset    Size  Chunks  Chunk Names
    index.html  567 kB       0
webpack: bundle is now VALID.

请教启动后status为Failed

您好，我使用的vue的webpack模板，启动以后控制台的status为Failed，浏览器打开以后空白，报错如下：
GET http://localhost:3000/main.bundle.js 404 (Not Found)
localhost/:1 Refused to execute script from 'http://localhost:3000/main.bundle.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
favicon.ico:1 GET http://localhost:3000/favicon.ico 404 (Not Found)

我是拿您的模板来学习vue和webpack的，请问这可能是什么问题呢？谢谢！

npm run build 出错

os ： MacBook Pro (Retina, Mid 2012)

ERROR in OfflinePlugin: Plugin's runtime wasn't added to one of your bundle entries. See this https://goo.gl/YwewYp for details.

以下是debuglog
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'build' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle [email protected]prebuild: [email protected]
6 silly lifecycle [email protected]prebuild: no script for prebuild, continuing
7 info lifecycle [email protected]build: [email protected]
8 verbose lifecycle [email protected]build: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]build: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/doublewood/Desktop/myProject/node_modules/.bin:/Library/Frameworks/Python.framework/Versions/3.6/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
10 verbose lifecycle [email protected]build: CWD: /Users/doublewood/Desktop/myProject
11 silly lifecycle [email protected]build: Args: [ '-c', 'npm run clean && better-npm-run build' ]
12 silly lifecycle [email protected]build: Returned: code: 2 signal: null
13 info lifecycle [email protected]~build: Failed to exec build script
14 verbose stack Error: [email protected] build: npm run clean && better-npm-run build
14 verbose stack Exit status 2
14 verbose stack at EventEmitter. (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:283:16)
14 verbose stack at emitTwo (events.js:125:13)
14 verbose stack at EventEmitter.emit (events.js:213:7)
14 verbose stack at ChildProcess. (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
14 verbose stack at emitTwo (events.js:125:13)
14 verbose stack at ChildProcess.emit (events.js:213:7)
14 verbose stack at maybeClose (internal/child_process.js:897:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:208:5)
15 verbose pkgid [email protected]
16 verbose cwd /Users/doublewood/Desktop/myProject
17 verbose Darwin 16.6.0
18 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build"
19 verbose node v8.1.2
20 verbose npm v5.0.4
21 error code ELIFECYCLE
22 error errno 2
23 error [email protected] build: npm run clean && better-npm-run build
23 error Exit status 2
24 error Failed at the [email protected] build script.
24 error This is probably not a problem with npm. There is likely additional logging output above.
25 verbose exit [ 2, true ]

window平台下start报错

nmp logs:
0 info it worked if it ends with ok
1 verbose cli [ 'D:\Program Files\nodejs\node.exe',
1 verbose cli 'D:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'start',
1 verbose cli '--scripts-prepend-node-path=auto' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle [email protected]prestart: [email protected]
6 silly lifecycle [email protected]prestart: no script for prestart, continuing
7 info lifecycle [email protected]start: [email protected]
8 verbose lifecycle [email protected]start: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]start: PATH: D:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;D:\www\GitHub\create-webpack-app\react\node_modules.bin;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Python27;C:\Python27\Scripts;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\GtkSharp\2.12\bin;C:\Program Files\Microsoft\Web Platform Installer;C:\Program Files (x86)\Microsoft ASP.NET\ASP.NET Web Pages\v1.0;C:\Program Files (x86)\Windows Kits\8.0\Windows Performance Toolkit;C:\Program Files\Microsoft SQL Server\110\Tools\Binn;C:\Python27;C:\WINDOWS\system32\config\systemprofile.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files (x86)\Windows Kits\8.1\Windows Performance Toolkit;C:\Program Files\Git\cmd;D:\ProgramData\adtbundlewindows\sdk\tools;D:\ProgramData\adtbundlewindows\sdk\platform-tools;C:\Python27;C:\Program Files (x86)\Java\jdk1.8.0_73\bin;D:\Program Files\TortoiseSVN\bin;D:\Program Files\phpfind\phpb;C:\ProgramData\ComposerSetup\bin;D:\Program Files\apache-maven-3.3.9\bin;D:\Program Files (x86)\HashiCorp\Vagrant\bin;D:\Program Files\nodejs;C:\Ruby23-x64\bin;C:\Users\YTYT\AppData\Roaming\Composer\vendor\bin;C:\Users\YTYT\AppData\Roaming\npm
10 verbose lifecycle [email protected]start: CWD: D:\www\GitHub\create-webpack-app\react
11 silly lifecycle [email protected]start: Args: [ '/d /s /c',
11 silly lifecycle 'better-npm-run start:dll && better-npm-run start:dev' ]
12 silly lifecycle [email protected]start: Returned: code: 1 signal: null
13 info lifecycle [email protected]~start: Failed to exec start script
14 verbose stack Error: [email protected] start: better-npm-run start:dll && better-npm-run start:dev
14 verbose stack Exit status 1
14 verbose stack at EventEmitter. (D:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:255:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:191:7)
14 verbose stack at ChildProcess. (D:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:191:7)
14 verbose stack at maybeClose (internal/child_process.js:891:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid [email protected]
16 verbose cwd D:\www\GitHub\create-webpack-app\react
17 error Windows_NT 10.0.10586
18 error argv "D:\Program Files\nodejs\node.exe" "D:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "start" "--scripts-prepend-node-path=auto"
19 error node v6.11.1
20 error npm v3.10.10
21 error code ELIFECYCLE
22 error [email protected] start: better-npm-run start:dll && better-npm-run start:dev
22 error Exit status 1
23 error Failed at the [email protected] start script 'better-npm-run start:dll && better-npm-run start:dev'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the react-boilerplate package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error better-npm-run start:dll && better-npm-run start:dev
23 error You can get information on how to open an issue for this project with:
23 error npm bugs react-boilerplate
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls react-boilerplate
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]

cmd下
to be executed: "./node_modules/.bin/webpack --config ./dev-config/webpack.dll.config.js"
'.' ��ڲ��ⲿ��Ҳ��ǿ��еĳ��
��ļ��

npm ERR! Windows_NT 10.0.10586
npm ERR! argv "D:\Program Files\nodejs\node.exe" "D:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "start" "--scripts-prepend-node-path=auto"

几点问题

flowconfig 里的 libs 下包含 node_modules 不合适，导致 flow 运行会很慢
说引入 flow，其实没有实际应用

npm start 构建失败

babel相关的包我都装好了呀，为嘛还会去请求获取babel的？

Error in multi main │┌─Operation──────────────────────────┐
│ Module not found: Error: Can't resolve 'babel' in '/Learn/react/sharefly-reactdemo/Webpack2-React-Redux-Boile ││ │
│ rplate-master' ││ idle (3s) │
│ BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders. │└────────────────────────────────────┘
│ You need to specify 'babel-loader' instead of 'babel'. │┌─Progress───────────────────────────┐
│ resolve 'babel' in '/Learn/react/sharefly-reactdemo/Webpack2-React-Redux-Boilerplate-master'

跑npm start出错

Failed to compile.
Error in ./src/client.js
Module build failed: Error: Couldn't find preset "flow" relative to directory "/Users/doublewood/Desktop/myProject/dev-config/tool"
at Array.map (native)
dev-config/tool下面的 .babelrc
"presets": [
[
"env",
{
"modules": false
}
],
"stage-0",
"flow"
],

关于react-router V4与同构

react-router V4 官方文档上说明不支持代码分割+服务端渲染。并且祝福要一起使用的人。
大大，有什么好的解决方案吗？

react/webpack 打包失败

log：
0 info it worked if it ends with ok
1 verbose cli [ '/Users/tigerye/.nvm/versions/node/v8.10.0/bin/node',
1 verbose cli '/Users/tigerye/.nvm/versions/node/v8.10.0/bin/npm',
1 verbose cli 'run',
1 verbose cli 'build' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle @wx/[email protected]prebuild: @wx/[email protected]
6 info lifecycle @wx/[email protected]build: @wx/[email protected]
7 verbose lifecycle @wx/[email protected]build: unsafe-perm in lifecycle true
8 verbose lifecycle @wx/[email protected]build: PATH: /Users/tigerye/.nvm/versions/node/v8.10.0/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/tigerye/Documents/WorkSpace/learning/react/react/webpack/node_modules/.bin:/Users/tigerye/anaconda/bin:/usr/local/opt/coreutils/libexec/gnubin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Users/tigerye/anaconda/bin:/Users/tigerye/.nvm/versions/node/v8.10.0/bin:/usr/local/opt/coreutils/libexec/gnubin:/usr/local/mysql/bin:/usr/local/mysql/bin
9 verbose lifecycle @wx/[email protected]build: CWD: /Users/tigerye/Documents/WorkSpace/learning/react/react/webpack
10 silly lifecycle @wx/[email protected]build: Args: [ '-c',
10 silly lifecycle 'npm run clean && BABEL_ENV=production webpack --config ./dev-config/webpack.config.prod.js --mode production' ]
11 silly lifecycle @wx/[email protected]build: Returned: code: 2 signal: null
12 info lifecycle @wx/[email protected]build: Failed to exec build script
13 verbose stack Error: @wx/[email protected] build: npm run clean && BABEL_ENV=production webpack --config ./dev-config/webpack.config.prod.js --mode production
13 verbose stack Exit status 2
13 verbose stack at EventEmitter. (/Users/tigerye/.nvm/versions/node/v8.10.0/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:285:16)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at EventEmitter.emit (events.js:214:7)
13 verbose stack at ChildProcess. (/Users/tigerye/.nvm/versions/node/v8.10.0/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at ChildProcess.emit (events.js:214:7)
13 verbose stack at maybeClose (internal/child_process.js:925:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
14 verbose pkgid @wx/[email protected]
15 verbose cwd /Users/tigerye/Documents/WorkSpace/learning/react/react/webpack
16 verbose Darwin 18.7.0
17 verbose argv "/Users/tigerye/.nvm/versions/node/v8.10.0/bin/node" "/Users/tigerye/.nvm/versions/node/v8.10.0/bin/npm" "run" "build"
18 verbose node v8.10.0
19 verbose npm v5.6.0
20 error code ELIFECYCLE
21 error errno 2
22 error @wx/[email protected] build: npm run clean && BABEL_ENV=production webpack --config ./dev-config/webpack.config.prod.js --mode production
22 error Exit status 2
23 error Failed at the @wx/[email protected] build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 2, true ]