cyberfei / puzzle Goto Github PK
View Code? Open in Web Editor NEWA pluggable micro-frontend structure based on Vue and Webpack5. 基于 Vue 和 Webpack5 的可热插拔式微前端架构
License: MIT License
A pluggable micro-frontend structure based on Vue and Webpack5. 基于 Vue 和 Webpack5 的可热插拔式微前端架构
License: MIT License
我在test 里面的vue文件修改了文字,预览或更新的时候发现页面没有被更新,其他页面没有这种情况, 看到了test 有个模块名字为测试页面 KeepAlive ,请问一下在哪里设置页面被更新不被缓存呢
作者您好!当前框架如何做到组件更新,自动影响到puzzle下所有独立的前端包,即puzzle下可能有多个前端包用到某个公共组件,现在更新了组件,每个引用了该组件的前端包都需要重新打包,怎么样能够做到只打公共组件包更新即可,所有引用该组件的前端包不需要重新打包?
通过npm run build 命令打包 dashboard以及test,放到服务器后没什么问题,但另外打包database模块后,放到服务器上面, 新增的database模块没有加载出来
Error: Cannot find module '../static/dll/core.manifest.json'
启动报错,请上传相关配置文件
生成的文件都是不带hash的,修改后需要清除缓存才能正常显示
1.做微前端大多是以发布文件作为加载模块
2.框架应该只做路由层,以及应该考虑一下多模块的切换以及生命周期卸载才能用到大项目上
你好,作者,我在发布项目的时候遇到了个问题,部署地址:http://air.goworkla.cn/vue/dist/ 我将项目路由方式更换为history,本地项目运行正常,部署到线上环境,页面未显示出来,并没有报错,我查看源文件 config.js ,core.f5dcb2c61d39e134ede4.dll.js,puzzle.a5a0ea60f8faab282355.dll.js 等文件都可以查看的到,控制台也未看到报错信息,
最近才接触微前端的概念,冒昧问一下作者大大,我有看到您项目介绍里说用您的框架开发的子项目打包后可以快速组合,是不是意味着用其它框架打包的项目无法组合,子项目也无法做到独立部署
已有的项目想结合这种热插拔,但是 vue-router 是用的 history 模式。我测试过这个 puzzle-demo 如果用 history 模式,会报错,请问能支持 history 路由吗?
我原先是写了一个dev.env.js 和 prod.env.js 的系统环境变量文件, 用于区分开发环境和生产环境的变量,
然后在webpack的plugins中添加
new webpack.DefinePlugin({
'process.env': require('./dev.env')
}),
项目中通过 process.env.XXX 来获取配置的变量.
现在我在 webpack.build.common.js 中增加了这个配置, 为什么读取不到这个变量?
我应该怎么改?
框架设计的很棒棒,学习了! 它可以有效解决vue巨石应用的一些痛点,给你点个赞👍
目前只关注生产环境: 如果build 后 没有选择全部的 puzzle模块内的 子页面,然后 运行后,在单独 发布一个之前未添加的页面 puzzlesDetail 页没有成功加载的
随着项目中页面的增多, 现在每次启动开发模式需要3分钟, 页面上点击一个页面加载的时候也明显变慢, 怎么调整可以减少开发模式中需要加载的模块?
比如在 puzzles 业务中,有 database 和 elastic 这两个业务,都调用了同一个 http 请求接口,这时候 api 接口应该写在什么位置,总不能在 database/scripts/api.js 中写一个,在 elastic 中再写一个一样的请求接口。
部署到nginx上面报错
core.c605fb4ef547060797fb.dll.js:7 ReferenceError: core_f5dcb2c61d39e134ede4 is not defined
at Object. (dashboard.js?v=0.1.0:1)
at c (dashboard.js?v=0.1.0:1)
at Object. (Frame.87a958011a1b65b1bd6b.js:1)
at c (dashboard.js?v=0.1.0:1)
at Module. (Frame.87a958011a1b65b1bd6b.js:1)
at c (dashboard.js?v=0.1.0:1)
我单独打包发布某个模块后,是否需要基座模块也要重新打包发布
报错E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\class-utils\node_modules\define-property\index.js:1
(function (exports, require, module, __filename, __dirname)
{SyntaxError: Invalid or unexpected token
at new Script (vm.js:74:7)
at NativeCompileCache._moduleCompile (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:240:18)
at Module._compile (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:186:36)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object. (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\class-utils\index.js:5:14)
at Module._compile (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object. (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\base\index.js:10:10)
at Module._compile (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object. (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\snapdragon\index.js:3:12)
at Module._compile (E:\Workspace\vue模板\puzzle-master\puzzle-master\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] core: webpack --hide-modules --config config/webpack.build.core.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] core script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2020-07-08T10_09_19_804Z-debug.log
能否基于vue-cli3或vue-cli4来构建该项目?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.