I'm trying to start a small page but it doesn't work
I am using odoo 10, I have the website module installed but apparently it throws some mistakes
main.js
odoo.define('gencontratos.main_page',function(require){
"use strict";
var Widget = require('web.Widget');
var RootPage = Widget.extend({
template:'qwebRoot',
start:function(){
console.log(this.$el);
console.log('start----------');
}
})
var page = new RootPage();
//page.setElement('#root');
page.appendTo('#root');
console.log('loaded---------------------');
})
root.xml
<templates id="templates" xml:space="preserve">
<t t-name="qwebRoot">
<div>
qweb
</div>
</t>
</templates>
error: Some modules could not be started web.assets_common.js:2995:302
Missing dependencies:
Array(4) [ "web.web_client", "web_editor.editor", "web_editor.summernote", "web_editor.transcoder" ]
web.assets_common.js:2995:431
Failed modules:
Array [ "gencontratos.main_page" ]
web.assets_common.js:2996:24
Rejected modules:
Array(4) [ "website_portal", "website_payment.website_payment", "website_sale.website_sale_category", "website_sale.website_sale" ]
web.assets_common.js:2997:26
Non loaded modules:
Array(16) [ "web.ChangePassword", "web.Apps", "account.reconciliation", "website_sale.backend", "mail.chat_client_action", "mail.ExtendedChatWindow", "mail.composer", "mail.chat_manager", "mail.Chatter", "mail.systray", … ]
I need help, I am starting a project for this version but it does not work, I have been missing for two days trying to solve this problem, the documentation does not say anything that can help me and on the Internet I have not found anything that could help me
Related
I'm trying to implement the vuejs (native) grid filtering and get the following error when trying to clear a set filter:
[Vue warn]: Error in v-on handler: "RangeError: invalid array length"
found in
---> <GridFilterCell>
<FilterRow>
<HeaderRow>
<Header>
<Grid>
<Reports3> at src/components/Reports3.vue
<Target> at src/components/Target.vue
<App> at src/App.vue
<Root> vue.runtime.esm.js:619
RangeError: "invalid array length"
node_modules FilterRow.js:51
node_modules FilterRow.js:115
node_modules FilterRow.js:150
VueJS 4
node_modules GridFilterCell.js:258
node_modules GridFilterCell.js:229
node_modules GridFilterCell.js:164
VueJS 3
vue.runtime.esm.js:1888
grid definition:
<Grid :style="{height: '450px'}"
:data-items="reports"
:sortable="true"
:sort="sort"
:filterable="true"
:filter="filter"
:filter-cell-render="filterRender"
:pageable="true"
:skip="skip"
:take="take"
:total="totalRecords"
:columns="columns"
#filterchange="filterChange"
#sortchange="sortChangeHandler"
#pagechange="pageChangeHandler">}
</Grid>
The data() filter methods:
data(){
return{
filter: {
logic: "and",
filters: [
{ field: "institutionId", operator: "neq", value: 0 },
{ field: "typeCode", operator: "neq", value: "" },
{ field: "name", operator: "neq", value: "" }
]
},
filterChange: function (e) {
this.filter = e.filter;
},
filterRender: function (h, defaultRendering, props, change) {
return defaultRendering;
}
}
}
This is the telerik doc page I'm using as a ref:
https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/
I ran into the same problem. As the telerik Vue grid (native) is still considered beta, I think there are still a few bugs like this one.
Here is a workaround until fixed by the telerik team.
In your project folder go´to:
node_modules#progress\kendo-vue-grid\dist\es\header\FilterRow.js
Find this line:
this.$emit.apply(this, __spreadArrays(['filterchange', filtersResult], e));
Replace it with this line:
this.$emit.apply(this, ['filterchange', filtersResult, e]);
And you should be ready to go.
I think __spreadArrays is a TypeScript (3.6) command and perhaps misplaced in the FilterRow.js. And it seems not to be necessary, as the objects filterchange, filtersResult and e are definitley not arrays themselves. You can check it by debugging. Keep in mind, that any update of the telerik grid version will force you to find and change the code line again until the bug is taken care of.
Hope it helps.
It was a bug in Kendo Vue Grid indeed and a fix for the issue was just released in version 0.3.7 of Kendo Vue Grid. If you observe other issues please let us know at https://www.telerik.com/support/kendo-ui or log the issues in our public repository - https://github.com/telerik/kendo-vue.
Greetings,
Plamen
I'm trying to install Vue froala on my Laravel project.
I followed the exact instruction provided here: https://github.com/froala/vue-froala-wysiwyg but I get:
Cannot find module 'babel-runtime/core-js/json/stringify
Not sure if I have to touch the webpack.mix.js. I only try to add jQuery required by Froala. So now it looks like that:
const mix = require('laravel-mix');
mix.webpackConfig(webpack => {
return {
resolve: {
extensions: ['.js', '.vue'],
alias: {
'#':__dirname + '/resources'
}
},
plugins: [
// ...
// Jquery loader plugin.
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
})
]
}
})
I found people fixing a similar problem manually installing babel-runtime as a package.json dependancy. I did, but it didn't work.
Any help?
Based on a recommendation, I used:
import VueFroala from 'vue-froala-wysiwyg/dist/vue-froala.min.js'
... which worked for me.
I'm trying to set up a simple gojs diagram into vuejs + webpack.
I installed gojs with npm and imported it on my project in the main.js file: import go from 'gojs'
Now my problem is how to make things work in the component implementation, that's the code of the component Diagram.vue:
<template>
<div id="myDiagramDiv" style="width:300px; height:300px;"></div>
</template>
<script>
export default {
name: 'Diagram',
data: function () {
return {
nodeDataArray: [
{key:1, text:"Alpha"},
{key:2, text:"Beta"}
],
linkDataArray: [
{from:1, to:2}
]
}
},
methods: {
getUnits: function(){
var $ = go.GraphObject.make;
myDiagram = $(go.Diagram, "myDiagramDiv");
myDiagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray);
}
},
mounted: function(){
this.getUnits();
}
}
</script>
it compiles without error but I can only see a white empty box...
You haven't initialized the Diagram yet. That is typically done by calling go.GraphObject.make(go.Diagram, theHTMLDivElement, { . . . options . . .})
There is a complete but simple example of using GoJS in a Vue.js framework at https://gojs.net/latest/samples/vue.html.
ow my problem is how to make things work in the component implementation
There is an official (made by the GoJS team) VueJS + Webpack + GoJS project in the gojs-projects github, that you can use as an example: https://github.com/NorthwoodsSoftware/GoJS-projects
I am really new to Dojo so this may sound dumb.
I am using Dojo 1.7 as a hosted resource (that is, I downloaded the dojo package and put it under the source code). Then I have a customized module defined in another folder. The structure looks like this:
/
libs/
js/
dojo/
dojo.js
myPage/
myModules/
myCustomizedModule.js
index.html
I am using the "define" function to define a module in myPage/myModules/myCustomizedModule.js
In "myPage" folder, I am using index.html to require the customized module:
<script>
require(["myPage/myModules/myCustomizedModule"], function(myCustomizedModule){
// Do something.
})
</script>
However, I can't get it to work: the console reported an error:
"http://localhost/myDojoTest/libs/js/dojo/myPage/MyModules/myCustomizedModule.js 404 (Not found)".
I know this directory is not right since "myPage" folder is not under "libs/js/dojo". But it seems when using the "require" statement, instead of using the relative path of the current HTML document, the code uses the current path for the dojo.js file.
Is there anything I can do to correctly refer to my customized module?
Many thanks!
As per your requirement, you need to set up packages as indicated below
<!-- dojo configuration options -->
<!-- For Package configuration refer tutorial at http://dojotoolkit.org/documentation/tutorials/1.7/modules/ -->
<script type="text/javascript">
var dojoConfig = {
async: true,
baseUrl: "/",
tlmSiblingOfDojo: false,
packages: [
{ name: "dojo", location: "libs/js/dojo" },
{ name: "dijit", location: "libs/js/dijit" },
{ name: "dojox", location: "libs/js/dojox" },
{ name: "myModules", location: "myPage/myModules" }
]
};
</script>
You can than access dojo, dijit and myModules in require function call as.
Remember you need to precede the modules with their respective packages.
<script>
require([
//Require resources.
"dojo/store/Memory",
"myModules/myCustomizedModule"
], function(Memory, myCustomizedModule){
....
}
);
</script>
Hope it helps.
I am having some problems with the optimized code that weyland generates. Here is what I did so far:
This is my project structure:
This is my weyland-config file:
exports.config = function(weyland) {
weyland.build('main')
.task.uglifyjs({
include:['www/**/*.js', 'www/js/durandal/**/*.js']
})
.task.rjs({
include:['www/**/*.{js,html}', 'www/js/durandal/**/*.js'],
loaderPluginExtensionMaps:{
'.html':'text'
},
rjs:{
name:'libs/require/require', //to deploy with require.js, use the build's name here instead
baseUrl : '../www/js',
paths : {
'text': 'libs/require/text',
'durandal': 'durandal',
'plugins': 'durandal/plugins',
'transitions': 'durandal/transitions',
'knockout': 'empty:',
'bootstrap': 'empty:',
'jquery': 'empty:'
},
inlineText: true,
optimize : 'none',
pragmas: {
build: true
},
stubModules : ['text'],
keepBuildDir: true,
out:'../www/js/main-built.js'
}
});
}
This is what I added in my index.html file to run the generated file instead of the one created by me:
<script src="js/main-built.js"></script>
I have also tryed using:
<script data-main="js/main-built" src="js/libs/require/require.js"></script>
This is what I had before:
<script data-main="js/main" src="js/libs/require/require.js"></script>
After I run weyland build on the command line the main-built file get's generated without any errors.
If I try to run the app the applycation freezez at the start screen as if the the app.start() method never get's called and no errors are being displayed.
I have checked chrome debugging tools the main-built file is recieved by the client it just seems it does nothing.
What am I doing wrong?
EDIT
I have also tryed building using almond-custom and ading this aditional configuration:
insertRequire:['main']
wrap:true
When I try to run the app I get this error:
Uncaught Error: main missing durandal/app
In my main fail I am loading the 'durandal/app' threw require js and for some reason it can not find it anymore