I'm trying to implement clipboardjs into a project and to do so I have the clipboardjs.js file located in ./modules/clipboardjs.js. In the main.coffee file the line require './modules/clipboardjs' is implementing the file. Then I have two twig templates one with a macro initializing the clipboardjs object like so:
<script>
new ClipboardJS('{{ selector }}');
</script>
and the other being the main template file that has all the logic to produce the url. I was having success with a different implementation but now that I'm trying to use the main.coffeescript file to import the js file it's not copying at all. Any thoughts on what I might need to do to get this file loaded properly?
EDIT:
I've tried both solutions by changing the requires statement to ClipboardJS = require './modules/clipboardjs' and window.ClipboardJS = require './modules/clipboardjs'
and both times the errors I'm getting in chrome are:
Uncaught TypeError: Cannot set property 'ClipboardJS' of undefined
at webpackUniversalModuleDefinition (clipboardjs.js:15)
at Module.<anonymous> (clipboardjs.js:7)
at Module../src/scripts/administration/modules/clipboardjs.js (admin.js:190240)
at __webpack_require__ (bootstrap:724)
at fn (bootstrap:101)
at Object../src/scripts/administration/main.coffee (main.coffee:14)
at __webpack_require__ (bootstrap:724)
at fn (bootstrap:101)
at Object.1 (admin.js:192117)
at __webpack_require__ (bootstrap:724)
articles:2332 Uncaught ReferenceError: ClipboardJS is not defined
at articles:2332
(anonymous) # articles:2332
It seems like when I call the ClipboardJS constructor it's not finding the code it needs.
EDIT 2:
#caffeinated.tech I'm not entirely sure, I'm a new dev, but I know they use webpack and gulp. Is there a way to check?
It's probably a problem with scope. In Javascript, a class / variable / function defined at the top level will become globally available in all other scripts in your project.
But in coffeescript, these are scoped within the file, so cannot be used outside the file they are defined in.
You should be able to fix it by assigning the imported ClipboardJS to the global window object (If you are doing any server side rendering, you will have to use global as a fallback to window)
window.ClipboardJS = require './modules/clipboardjs'
Related
In the walkthrough step 7: JSON Model example, the app apparently works as documented but I see the following error in the console:
Error: Modules that use an anonymous define() call must be loaded with a require() call; they must not be executed via script tag or nested into other modules.
The only other instance of this message that I could find seems, to my untrained eye, to deal with a wholly different scenario.
I've tried both Firefox and Chromium, CDN hosting vs local hosting, two different UI5 versions (1.77.0 and 1.79.0), both minified and plain, so I'd suppose this is really something in the code itself.
What could it be? Also, is it something I can safely ignore and why?
Anonymous define
Calling sap.ui.define([...],...) defines a module anonymously because the 1st argument is not a string (module name) but a list of the module's dependencies. If the module name is omitted, the framework automatically determines it based on how the module script was referenced.
Use anonymous sap.ui.define once at top-level of the JS file content, not multiple times.
Replace sap.ui.define with sap.ui.require when simply requiring existing modules.
Cf. my comment at https://github.com/SAP/openui5/issues/2203#issuecomment-420918457.
Named module define
The 1st argument in sap.ui.define("MyModule",[...] ,...) defines the name of the module manually which must be passed when:
Defining a nested module within an existing module definition in a single JS file content.
Defining a module which was initiated by a <script> tag from HTML.
The walkthrough is fixed with SAP/openui5#6302b8f and SAP/openui5-docs#43 accordingly.
Sometimes i have already predefined code and i want functions to autoimport with Quick Fix action is it possible ?
VS Code is conservative when checking JavaScript code. Variables such as beforeSaveWarrior may be a global defined somewhere else (this is a surprisingly common pattern in JavaScript land). This means that using an undefined variable such as beforeSaveWarrior is not considered an error by default.
To show undefined variables as errors and get quick fixes that import them, you need to enable semantic checking in your Js file. The easiest way to to do this is to add // #ts-check at the top of your JavaScript file. Now undefined variables such as beforeSaveWarrior will be marked as errors. The lightbulb for the error should include a fix that adds the import
Python is my newest language (Python-2.6), my background is in C/C++. Normally, I would create a global variable and be able to modify and access it across all of my files. I am trying to achieve that same functionality in python.
Based off of this post: Python - Visibility of global variables in imported modules I see that "Globals in Python are global to a module, not across all modules". I have multiple variables that rely on user input, and must be accessed and modified by four different modules and in the main code, which is why I am trying to use global(ish) variables in Python.
I have two attemps to make this work:
1) If I stick the code with the modifiable global variables in my main code, I run into the issue of "Executing the Main Module Twice" as detailed here: http://python-notes.curiousefficiency.org/en/latest/python_concepts/import_traps.html The program works, other than being executed twice.
2) If I create a separate module and put the variables into a function, I find that I have undefined variables in my other modules and my code will error out. From steping through the code, I see that when the variables are accessible/modifiable by moduleA, but then everything breaks when moduleB and moduleC try to use them, because the modifications did not stay.
How do I utilize Python to suit my needs? I believe my problem lies with attempting to use global variables and importing the global variables
To solve this issue, I stopped trying to use global variables across multiple modules in my main code and stopped importing individual variables. I basically ended up placing moduleA(a single function) within moduleB. I created a class within moduleB for the functions I needed. The main code and moduleC now accesses those functions.
I still use global variables though, within the functions in moduleB. If I made the variables not global I got attribute errors.
Working with Rails 3.1 (rc5), and I'm noticing that any coffeescript file I include rails (or sprockets) is adding in initializing javascript at the top and bottom. In other words, a blank .js.coffee file gets outputted looking like this:
(function() {
}).call(this);
This is irritating because it screws up my javascript scope (unless I really don't know what I'm doing). I generally separate all of my javascript classes into separate files and I believe that having that function code wrapping my classes just puts them out of scope from one another. Or, atleast, I can't seem to access them as I am continually getting undefined errors.
Is there a way to override this? It seems like this file in sprockets has to do with adding this code:
https://github.com/sstephenson/sprockets/blob/master/lib/sprockets/jst_processor.rb
I understand that wrapping everything in a function might seem like an added convenience as then nothing is ran until DOM is loaded, but as far as I can tell it just messes up my scope.
Are you intending to put your objects into the global scope? I think CoffeeScript usually wraps code in anonymous functions so that it doesn't accidentally leak variables into the global scope. If there's not a way to turn it off, your best bet would probably be to specifically add anything you want to be in the global scope to the window object:
window.myGlobal = myGlobal;
It seems to be a javascript best practice these days to put code inside a function scope and be explicit about adding objects to the global scope, and it's something I usually see CoffeeScript do automatically.
You don't want to put everything into the global scope. You want a module or module like system where you can namespace things so you don't colide with other libraries. Have a read of
https://github.com/jashkenas/coffee-script/wiki/Easy-modules-with-coffeescript
I have defined a GWT module that includes an external javascript file using tag. I have written a GWTTestCase that returns the above described module's name. When my testcase accesses a javascript object I see the following exception
Caused by: com.google.gwt.core.client.JavaScriptException: (null): null
Any idea on how to fix this?
Am I right in assuming that the scripts included in the gwt module definition file will be available when executing the GWTTestCase?
I have fixed it myself. Apparently, when accessing such objects it should be referenced using $wnd variable.
Example: test.js defined object test. In order to access it from GWT one should use, $wnd.test
Hope this answers saves somebody else' time.