builderio / builder Goto Github PK
View Code? Open in Web Editor NEWDrag and drop headless CMS for React, Vue, Svelte, Qwik, and more
Home Page: https://builder.io/m/developers
License: MIT License
Drag and drop headless CMS for React, Vue, Svelte, Qwik, and more
Home Page: https://builder.io/m/developers
License: MIT License
Hi,
I get the following issue when trying to serve an angular application after importing BuilderModule in angular. It happens when using it in existing Angular 8 and also in a fresh Angular 9 app.
ERROR in node_modules/@builder.io/sdk/dist/src/builder.class.d.ts:2:10 - error TS2305: Module '"http"' has no exported member 'ServerRequest'.
I had a look around and found one issue on a different project that seems to be similar
Sometimes we are getting console error:
this.subscriptions.push(() => subscription.unsubscribe())
TypeError: Cannot read property 'push' of undefined
at builder-component-element.<anonymous> (../../../../src/elements.ts:526:12)
at None (/js/[email protected]/dist/system/angular/lite/_tslib-dd45d077.js:1:1406)
at Object.next (/js/[email protected]/dist/system/angular/lite/_tslib-dd45d077.js:1:1511)
at None (/js/[email protected]/dist/system/angular/lite/_tslib-dd45d077.js:1:448)
at new e (/polyfills-es5.67f86d0307c42298261e.js:1:225322)
...
(22 additional frame(s) were not displayed)
I getting this kind of error when trying to run builder.io content on IE11.
I spent some time on investigation and I think the reason of this error is CustomEvent. On IE it can not be called using a constructor.
Here is a polyfill for it:
https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#Polyfill
Unhandled Promise rejection: Object doesn't support this action ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Object doesn't support this action TypeError: Object doesn't support this action
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/builder-webcomponents.js:1:32551)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:1402)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:715)
at n (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:277)
at ZoneDelegate.prototype.invoke (http://192.168.88.239:5000/polyfills-es5.js:23185:13)
at Zone.prototype.run (http://192.168.88.239:5000/polyfills-es5.js:22945:17)
at Anonymous function (http://192.168.88.239:5000/polyfills-es5.js:23705:17)
at ZoneDelegate.prototype.invokeTask (http://192.168.88.239:5000/polyfills-es5.js:23217:13)
at
"Unhandled Promise rejection:"
"Object doesn't support this action"
"; Zone:"
"<root>"
"; Task:"
"Promise.then"
"; Value:"
{
[functions]: ,
__proto__: { },
description: "Object doesn't support this action",
message: "Object doesn't support this action",
name: "TypeError",
number: -2146827843,
stack: "TypeError: Object doesn't support this action
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/builder-webcomponents.js:1:32551)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:1402)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:715)
at n (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:277)
at ZoneDelegate.prototype.invoke (http://192.168.88.239:5000/polyfills-es5.js:23185:13)
at Zone.prototype.run (http://192.168.88.239:5000/polyfills-es5.js:22945:17)
at Anonymous function (http://192.168.88.239:5000/polyfills-es5.js:23705:17)
at ZoneDelegate.prototype.invokeTask (http://192.168.88.239:5000/polyfills-es5.js:23217:13)
at Zone.prototype.runTask (http://192.168.88.239:5000/polyfills-es5.js:22990:21)
at drainMicroTaskQueue (http://192.168.88.239:5000/polyfills-es5.js:23396",
Symbol()_8.zj8vq7cuauw: undefined,
Symbol()_j.zj8vq7cuaoe: undefined,
Symbol()_k.zj8vq7cuaoe: undefined,
Symbol()_p.zj8vq7cuaoe: undefined,
Symbol(INITIAL_VALUE)_n.zj8vq7cuaoe: undefined,
Symbol(react.element)_l.zj8vq7cuaoe: undefined,
Symbol(rxSubscriber)_m.zj8vq7cuaoe: undefined,
Symbol(rxSubscriber)_o.zj8vq7cuaoe: undefined,
Symbol(Symbol._hidden)_i.zj8vq7cuaoe: undefined,
Symbol(target)_q.zj8vq7cuaoe: undefined,
Symbol(unsubscribe)_r.zj8vq7cuaoe: undefined
}
"TypeError: Object doesn't support this action
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/builder-webcomponents.js:1:32551)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:1402)
at Anonymous function (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:715)
at n (https://cdn.builder.io/js/[email protected]/dist/system/angular/_tslib-dd45d077.js:1:277)
at ZoneDelegate.prototype.invoke (http://192.168.88.239:5000/polyfills-es5.js:23185:13)
at Zone.prototype.run (http://192.168.88.239:5000/polyfills-es5.js:22945:17)
at Anonymous function (http://192.168.88.239:5000/polyfills-es5.js:23705:17)
at ZoneDelegate.prototype.invokeTask (http://192.168.88.239:5000/polyfills-es5.js:23217:13)
at Zone.prototype.runTask (http://192.168.88.239:5000/polyfills-es5.js:22990:21)
at drainMicroTaskQueue (http://192.168.88.239:5000/polyfills-es5.js:23396"
When creating a symbol with dynamic data inputs and bindings, re-ordering the Inputs in DATA tab doesn’t save their order.
Example vid - https://drive.google.com/file/d/1Ro4_AZrggX5Rwag8BoNTkq1JeVLp-NxX/view
Spectrum thread (private) - https://spectrum.chat/builder/knowde/blinking-builder-io-angular-content-while-replacing-from-second-request~fcbb3eb3-ac1b-48d0-b9bb-d5e48d58cdb1
2 things we can do here
One is offer a prerender=false option to only render in the builder-webcomponent-element. This is a quick fix, but we should also fix the underlying issue
Other SDKs that hydrate don't have this flashing issue so should be fixable in angular as well
The content editor page returns the message:
Oh no! We had an error :( Try refreshing this page and chat us or contact [email protected] if this continue
Please add a “clear” feature to color pickers. Currently, the only way to clear a color selection is a hack (setting color to 0% transparency). Can you add a clear method so we can properly clear the selected color.
When we are trying to use Elevio we are getting error.
Elevio code where issue appears:
And because of this error all angular components are gone (we are not seeing them on the page).
Elevio also using web components and it seems that it is an issue.
Repro steps:
When I trying to move an element around the element is copied instead of move only.
Check video for details:
https://drive.google.com/file/d/1Mz99R0Cw_7P1UdXGkO0MI_9xx3Pk8G_G/view
When in angular component I will have a link like:
<a href="javascript:void(0);"></a>
and I will use this component in Builder.io then @builderio/angular will try to use an Angular router to navigate, so it will throw 404.
It is caused by packages/angular/src/app/modules/builder/components/builder-component/builder-component.component.ts
onClick()
I need this kind of feature to create separate version of pages for each env.
Right now I am using Custom Targeting Attributes
but some times when I forgot to select a value for this targeting attribute page will be visible across all environments.
Can we add some kind of REQUIRED FOR: (models/models types?)
Or maybe I should use page options for it instead of targeting attrs?
What do you think @steve8708 @ca136 ?
Hi @steve8708
Seems like the saved filter views only works when you save to Your Views
within the Builder content page https://builder.io/content
.
When saving the filters for Your Organization
they disappear and are no where to be found.
I am struggling to get the Gatsby Example running - i.e. builder/examples/gatsby
.
Following the instructions of the readme npm run dev
results in an error indicating that builder-config
required on line 1 of gatsby-config.js does not exist.
Are there any other steps I am supposed to follow to get this example up and running that are not documented in the readme ?
When using NextJS to do SSR, after executing the following code
static async getInitialProps(ctx) {
const { res, req } = ctx;
const page = await builder.get(builderModel, { req, res }).promise();
return { ...initialProps, page };
}
Could it be possible to return the model option defaults even when not set?
here's a page as an example: https://staging.stilt.com/about
here's some package.json:
"@angular-builders/custom-webpack": "8.4.1",
"@angular-devkit/build-angular": "0.803.25",
"@angular/animations": "8.2.14",
"@angular/cdk": "8.2.3",
"@angular/cli": "8.3.25",
"@angular/common": "8.2.14",
"@angular/compiler": "8.2.14",
"@angular/compiler-cli": "8.2.14",
"@angular/core": "8.2.14",
"@angular/forms": "8.2.14",
"@angular/material": "8.2.3",
"@angular/platform-browser": "8.2.14",
"@angular/platform-browser-dynamic": "8.2.14",
"@angular/platform-server": "8.2.14",
"@angular/router": "8.2.14",
"@builder.io/angular": "1.0.82",
"@nguniversal/express-engine": "8.2.6",
"@nguniversal/module-map-ngfactory-loader": "8.2.6",
"@sentry/browser": "5.12.1",
"@types/node": "13.7.0",
"@types/segment-analytics": "0.0.32",
"angular2-text-mask": "9.0.0",
"core-js": "3.6.4",
"crypto-js": "3.1.9-1",
"express": "4.17.1",
"fs-extra": "8.1.0",
"hammerjs": "2.0.8",
"lodash.mergewith": "4.6.2",
"lodash.pick": "4.4.0",
"mock-express-request": "0.2.2",
"mock-express-response": "0.2.2",
"newrelic": "6.3.0",
"nginx-conf": "1.5.0",
"ngx-cookie": "4.1.2",
"ngx-uploader": "8.0.0",
"node-sass": "4.13.1",
"numeral": "2.0.6",
"request-promise": "4.2.5",
"robotstxt-webpack-plugin": "7.0.0",
"rxjs": "6.5.4",
"sitemap": "5.1.0",
"text-mask-addons": "3.8.0",
"tlds": "1.207.0",
"ts-md5": "1.2.7",
"ts-node": "8.6.2",
"typescript": "<3.5",
"typescript-require": "0.2.10",
"webpack-merge": "4.2.2",
"zone.js": "0.10.2"
let me know if you need anything else
On content page, any saved filters overrides the “all” view until you actively refresh the page
Steps to reproduce
We are using builder to manage a content section on pages within our app. When we load a builder page, we also load our app into the editor so we can full WYSIWYG experience.
However, when we first load the builder page into your editor, it takes several refreshes for the builder page to become editable.
Hi Steve
I've come across this error:
Warning: Invalid DOM property "class". Did you mean "className"?
Am I missing an extra step here or is this a kind of red-herring error that I can ignore ?
Also custom javascript for elements is completely ignored.
Severity: 3 of 5
Builder currently supports 3 breakpoints. Our site uses the standard Bootstrap breakpoints which include 5, XL, L, M, S, XS https://getbootstrap.com/docs/4.0/layout/overview/#responsive-breakpoints
We'd love it if Builder supported all 5 with the ability to customize the pixel widths at the Organization or Model level.
When we are trying to wrap our symbol in one row, on editor it is working fine but normal mode creating some wrapper that's preventing form applying correct styles.
Screeen recording:
https://www.loom.com/share/ab99e7c50fcd4a23b0487fab0a649b2e
Builder.io:
https://builder.io/content/149b6635affa46ec9a6a0233f825e040
When I trying to delete user from organization ( https://builder.io/account/organization ) I getting 404 with this error:
Also before I got this error I got an information (toastr) that said "Done" but even after refresh user is still on the list.
Expected to work. What happened: Cannot find type definition file for lodash.
Reproduce steps:
To replicate -
Make a page in Builder and add ab tests. When you render it on the site it'll show you all test variations rendered one on top of the other, rather than choosing the right test group to show instead
This could be a bug in the latest React or Core SDKs, or in the latest API
In my design I have this:
But in the preview I have this:
href
with link not added.
I have to create a new button element, copy the style and set the URL in order for the link to work.
Any reason why this functionality is not working as expected ?
Do you have any plans to support Ivy engine on angular ? Lack of support for Ivy has been a deal breaker for us.
Hi @steve8708
Whenever we are trying to display any content on IE11 on home page we are getting an empty response.
It is because of wrong user attribute URL Path:
On Chrome etc. builder is passing:
userAttributes.urlPath: '/'
but on IE11 builder passing empty string:
userAttributes.urlPath: ''
During build process (ng build
) in Angular (v8) I get an error:
ERROR in /Users/x/workspace/x-frontend/node_modules/@builder.io/sdk/dist/index.umd.min.js Module not found: Error: Can't resolve 'http' in '/Users/lyczos/workspace/x-frontend/node_modules/@builder.io/sdk/dist' ERROR in /Users/x/workspace/x-frontend/node_modules/@builder.io/sdk/dist/index.umd.min.js Module not found: Error: Can't resolve 'https' in '/Users/x/workspace/x-frontend/node_modules/@builder.io/sdk/dist'
To fix the issue I had to add
"browser": {
"./dist/index.umd.min.js": "./dist/index.umd.min.js",
"http": false,
"https": false
},
in @builder.io/sdk
-> package.json
.
node_modules/@builder.io/sdk/package.json
Same issue will appear for included example application
When more than one image is added to the page through the Cloudinary plugin, the last one to be added overrides all the other ones
I just updated the version of @builder/react
locally and when I'm trying to test the 404 page, I'm now getting this warning.
Our 404 page doesn't load either now and just renders the Loading...
copy. This warning also pops up on our test Builder page also along with a warning regarding class
instead of className
The test page renders fine however. Will continue seeing if it's something our end, but can't seem to find anything different as it was working as of Nov. 15th.
Used the example in the docs https://github.com/BuilderIO/builder#dynamic-landing-pages
We have placed the builder code into our pages to allow editing through builder. However, when our page loads, builder seems to be sending two calls to your CDN which forces our page to double load and to load slowly.
Such as WebCell (a new framework based on TSX & Web Components)
The Image
component seems to be acting up when rendering page in amp-mode
.
Getting the following errors:
For debugging purposes you can have a look at the builder page id 350f24762e8d48c3adea91b5e753d8be
in our account.
A live preview of this issue could be viewed here: https://hs.mersenne.now.sh/
Need ability to clear formatting from text editor
Steps to Reproduce
When I trying to query record from builder.io I getting empty array when I use boolean
value for in query params. I've already tried to pass true
, false
, 1
, 0
but without success.
It started to work when I changed the type of targeting variable from boolean
to string
And here you have params passed to builder CDN:
userAttributes.urlPath: /
userAttributes.host: localhost:5000
userAttributes.device: desktop
userAttributes.env: dev
userAttributes.loggedIn: false **(i've tried also 0)**
prerender: true
cacheSeconds: 5
options.page:/.prerender: true
options.page:/.model: "page"
options.page:/.static: false
Builder.io entry ID: 0434387fe28c48fc833979640008d033
@ca136 @steve8708 Can you take a look at it on builder.io server-side app?
When I've set prerender
flag to false
then the angular router is not handling routing (pages are fully reloaded).
When I set this flag back again to true
everything is working as expected
When we set [reloadOnRoute]="false"
in BuilderComponentComponent
there is no changes in component behavior. I think this is because right now Inputs are checked before they came. This logic should be moved to ngOnInit
hook
I am also thinking that rewriting routeReuseStrategy.shouldReuseRoute
is not a good idea. It can affect 3rd party components and libraries in the whole application.
Can’t see nested symbol in WYSIWYG when nesting symbols (adding symbols into symbols) in the same content model.
Steps to reproduce
This is in the @builder.io/react@dev
build. It looks like now the Builder page on our site is not rendering everything that's published in the dashboard page
In Builder
Our site (running locally)
It seems like it was working fine for a little bit, but not sure if you pushed any updates to the dev build that might be causing this.
When I view a published page and make changes to existing text content using the block text editor, the app doesn't detect this as a state change which means I can't publish these edits.
To workaround this, one has to make a change to the page the app does recognize like changing a style settings.
Can you update so that simply text changes are detected and prompt the "publish" action. thanks.
[deleted]
Via #43
When you daisy chain symbols (nest symbol into symbol), not all the configurable options are passing through.
Steps to reproduce
Hi!
I am pretty new to this kind of tools and I don't know how to code. I love builder.io because it is super easy to get things done but I am having trouble when trying to "install" the page I have created in my website (1mb.site).
I would like to do it in the simplest form (Don't use React nor Vanilla ....). I just want a code snippet in HTML with the things I have to change to show the page I have created in my page in 1mb.site. Could it be possible to have a video tutorial? It would be very useful.
Thanks in advance and congratulations for the hard work!!
After updating @builder.io/angular
package to latest version angular build is failing:
ERROR in /Users/lyczos/workspace/knowde-frontend/node_modules/@builder.io/angular/dist/fesm5/builder.io-angular.js
Module build failed (from /Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js):
TypeError: Cannot read property 'kind' of undefined
at isAngularDecoratorMetadataExpression (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:265:35)
at checkNodeForDecorators (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:77:21)
at visitNodes (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16514:30)
at Object.forEachChild (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16740:24)
at checkNodeForDecorators (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:68:31)
at visitNode (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16505:24)
at Object.forEachChild (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16635:21)
at checkNodeForDecorators (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:68:31)
at visitNode (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16505:24)
at Object.forEachChild (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16692:24)
at checkNodeForDecorators (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:68:31)
at visitNode (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16505:24)
at Object.forEachChild (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16703:24)
at checkNodeForDecorators (/Users/lyczos/workspace/knowde-frontend/node_modules/@angular-devkit/build-optimizer/src/transforms/scrub-file.js:68:31)
at visitNode (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16505:24)
at Object.forEachChild (/Users/lyczos/workspace/knowde-frontend/node_modules/typescript/lib/typescript.js:16599:21)
When I export a Symbol and then import it to new Builder instance, the symbol won't work
Steps to reproduce
Result
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.