I started getting this error today in the test suite of an Angular.js 1.5/Angular 5 project:
HeadlessChrome 64.0.3282 (Linux 0.0.0) ERROR
An error was thrown in afterAll
Uncaught ReferenceError: require is not defined
The issue appears after all of my tests have run successfully. What is bizarre is it runs well locally, but it's in a Jenkins CI server where it fails. From the other developers only 1 in 10 is seeing the same problem as Jenkins.
There are tons of other posts mentioning this same error but none addressed my exact problem, like this, this, this, ...
Anybody knows what the issue can be?
Edit:
The exception happens in modernizr/lib/cli.js, but no stack-trace appears:
and we get no call stack either:
After looking at the bower dependencies of our project with bower ls -o, we found a difference in a transient dependency of Zurb Foundation.
In the places were it worked, modernizr was set to 3.5.0:
├─┬ foundation#5.5.1
│ ├── fastclick#1.0.6
│ ├── jquery#2.1.4
│ ├─┬ jquery-placeholder#2.0.9
│ │ └── jquery#2.1.4
│ ├─┬ jquery.cookie#1.4.1
│ │ └── jquery#2.1.4
│ └── modernizr#3.5.0
In the places were it didn't work, it was set to 3.9.0:
├─┬ foundation#5.5.1
│ ├── fastclick#1.0.6
│ ├── jquery#2.1.4
│ ├─┬ jquery-placeholder#2.0.9
│ │ └── jquery#2.1.4
│ ├─┬ jquery.cookie#1.4.1
│ │ └── jquery#2.1.4
│ └── modernizr#3.9.0
Forcing the modernizr version to 3.5.0 in bower.json solved the issue:
"dependencies": {
...
"modernizr": "3.5.0"
}
I don't fully understand why modernizr was resolved to different versions in some computers, as in both cases we had the same Zurb Foundation's version pinned, but this was the way we fixed the issue.
Related
I believe what I'm asking is impossible, but I'm not terribly familiar with JavaScript and Yarn nor their possibilities so I'm asking as a longshot.
But with my project, I'm getting errors with xmldom versions below 0.7.0:
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ moderate │ Misinterpretation of malicious XML input │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package │ xmldom │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in │ >=0.7.0 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ expo-linking │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path │ expo-linking > expo-constants > #expo/config > │
│ │ #expo/config-plugins > #expo/plist > xmldom │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info │ https://www.npmjs.com/advisories/1769 │
└───────────────┴──────────────────────────────────────────────────────────────┘
I realize that I can resolve dependencies to higher versions using resolutions in my package.json. However, part of the problem with this dependency is that xmldom is now published as #xmldom/xmldom.
So, beyond just resolving a dependency to a different version, is it at all possible to resolve it to a different package?
React solution is showing one high vulnerability in npm-audit due to Denial of Service in react-svg-loader version 3.03 due to css-what.
What is the possbile solution of the issue?
Issue is as shown below:
───────────────┴──────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High │ Denial of Service │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package │ css-what │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in │ >=5.0.1 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ react-svg-loader │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path │ react-svg-loader > react-svg-core > svgo > css-select > │
│ │ css-what │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info │ https://npmjs.com/advisories/1754 │
└───────────────┴─────────────────────────────────────────────────────────────
I tried replacing react-svg-loader with https://www.npmjs.com/package/svg-react-loader. It does the same thing only we need to change the package and web pack config. It does not have any vulnerability as of now.
I have created a debian virtual machine where I have installed meteor version 1.4.2.
I am working on the simple-todos meteor tutorial, blaze view.
I have done everything on step 2 [several times; even to the point of deleting and starting over many times]; I've even done straight c&p of all the code into the various files. I have spent several hours searching google; git-hub, and stackoverflow and have not found anything that seems to relate to my problem.
When I look at the app in the browser, the page is blank ... when I look in the console I have the following error code:
Uncaught Error: Cannot find module './template.body.js'
at require (http://localhost:3000/packages/modules-runtime.js?hash=ab7e8d32b6c7b5a5fa7ae1b65e8225c4f9e30223:119:19) [this error continues with a lot more references and hashes, but I can't post more than 2 links]
If someone could at least point me in the right direction so I can continue to research this, I would be most grateful.
OK, that's weird... I replicated what you were seeing. It happens when you have meteor RUNNING while doing this coding, so it is doing live code update, but the module is not being built/included properly.
All I did was STOP and restart Meteor. And it worked.
Not sure why it is not loading the modules in a rebuild and hot code push, but there you have it, that's the fix.
Here is my shell so you see what I did:
shaunst:~/workspace $ curl https://install.meteor.com/ | sh
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 7784 0 7784 0 0 23942 0 --:--:-- --:--:-- --:--:-- 23950
Downloading Meteor distribution
######################################################################## 100.0%
Meteor 1.4.2 has been installed in your home directory (~/.meteor).
Writing a launcher script to /usr/local/bin/meteor for your convenience.
This may prompt for your password.
To get started fast:
$ meteor create ~/my_cool_app
$ cd ~/my_cool_app
$ meteor
Or see the docs at:
docs.meteor.com
shaunst:~/workspace $ meteor create simple-todos
Created a new Meteor app in 'simple-todos'.
To run your new app:
cd simple-todos
meteor
If you are new to Meteor, try some of the learning resources here:
https://www.meteor.com/learn
shaunst:~/workspace $ cd simple-todos/
shaunst:~/workspace/simple-todos $ meteor npm install
simple-todos# /home/ubuntu/workspace/simple-todos
└─┬ meteor-node-stubs#0.2.3
├── assert#1.3.0
├─┬ browserify-zlib#0.1.4
│ └── pako#0.2.8
├─┬ buffer#4.5.1
│ ├── base64-js#1.1.2
│ ├── ieee754#1.1.6
│ └── isarray#1.0.0
├─┬ console-browserify#1.1.0
│ └── date-now#0.1.4
├── constants-browserify#1.0.0
├─┬ crypto-browserify#3.11.0
│ ├─┬ browserify-cipher#1.0.0
│ │ ├─┬ browserify-aes#1.0.6
│ │ │ ├── buffer-xor#1.0.3
│ │ │ └── cipher-base#1.0.2
│ │ ├─┬ browserify-des#1.0.0
│ │ │ ├── cipher-base#1.0.2
│ │ │ └─┬ des.js#1.0.0
│ │ │ └── minimalistic-assert#1.0.0
│ │ └── evp_bytestokey#1.0.0
│ ├─┬ browserify-sign#4.0.0
│ │ ├── bn.js#4.11.1
│ │ ├── browserify-rsa#4.0.1
│ │ ├─┬ elliptic#6.2.3
│ │ │ ├── brorand#1.0.5
│ │ │ └── hash.js#1.0.3
│ │ └─┬ parse-asn1#5.0.0
│ │ ├─┬ asn1.js#4.5.2
│ │ │ └── minimalistic-assert#1.0.0
│ │ ├─┬ browserify-aes#1.0.6
│ │ │ ├── buffer-xor#1.0.3
│ │ │ └── cipher-base#1.0.2
│ │ └── evp_bytestokey#1.0.0
│ ├─┬ create-ecdh#4.0.0
│ │ ├── bn.js#4.11.1
│ │ └─┬ elliptic#6.2.3
│ │ ├── brorand#1.0.5
│ │ └── hash.js#1.0.3
│ ├─┬ create-hash#1.1.2
│ │ ├── cipher-base#1.0.2
│ │ ├── ripemd160#1.0.1
│ │ └── sha.js#2.4.5
│ ├── create-hmac#1.1.4
│ ├─┬ diffie-hellman#5.0.2
│ │ ├── bn.js#4.11.1
│ │ └─┬ miller-rabin#4.0.0
│ │ └── brorand#1.0.5
│ ├── inherits#2.0.1
│ ├── pbkdf2#3.0.4
│ ├─┬ public-encrypt#4.0.0
│ │ ├── bn.js#4.11.1
│ │ ├── browserify-rsa#4.0.1
│ │ └─┬ parse-asn1#5.0.0
│ │ ├─┬ asn1.js#4.5.2
│ │ │ └── minimalistic-assert#1.0.0
│ │ ├─┬ browserify-aes#1.0.6
│ │ │ ├── buffer-xor#1.0.3
│ │ │ └── cipher-base#1.0.2
│ │ └── evp_bytestokey#1.0.0
│ └── randombytes#2.0.3
├── domain-browser#1.1.7
├── events#1.1.0
├─┬ http-browserify#1.7.0
│ ├── Base64#0.2.1
│ └── inherits#2.0.1
├── https-browserify#0.0.1
├── os-browserify#0.2.1
├── path-browserify#0.0.0
├── process#0.11.2
├── punycode#1.4.1
├── querystring-es3#0.2.1
├─┬ readable-stream#2.0.6
│ ├── core-util-is#1.0.2
│ ├── inherits#2.0.1
│ ├── isarray#1.0.0
│ ├── process-nextick-args#1.0.6
│ └── util-deprecate#1.0.2
├─┬ stream-browserify#2.0.1
│ └── inherits#2.0.1
├── string_decoder#0.10.31
├── timers-browserify#1.4.2
├── tty-browserify#0.0.0
├─┬ url#0.11.0
│ ├── punycode#1.3.2
│ └── querystring#0.2.0
├─┬ util#0.10.3
│ └── inherits#2.0.1
└─┬ vm-browserify#0.0.4
└── indexof#0.0.1
shaunst:~/workspace/simple-todos $ meteor --port 8080
[[[[[ ~/workspace/simple-todos ]]]]]
=> Started proxy.
=> Started MongoDB.
=> Started your app.
=> App running at: http://localhost:8080/
=> Meteor server restarted
=> Meteor server restarted
=> Meteor server restarted
=> Meteor server restarted
=> Client modified -- refreshing (x3)
=> Meteor server restarted
=> Meteor server restarted
=> Client modified -- refreshing^C
shaunst:~/workspace/simple-todos $ ^C
shaunst:~/workspace/simple-todos $ meteor --port 8080
[[[[[ ~/workspace/simple-todos ]]]]]
=> Started proxy.
=> Started MongoDB.
=> Started your app.
=> App running at: http://localhost:8080/
=> Client modified -- refreshing (x2)
I'm experiencing the same.
I did as user Shaun Stoltz suggested (restart Meteor), and it did work. But then I added more files to the imports folder, and the error recurred, now referencing the new file missing 'template...'.
I gave Meteor another restart, and the build worked again.It seems that meteor omits the new files from the build while it's watching. Only upon restart the new files get included. This is a real nuisance as while following contemporary componental approach, i will be creating many small files, and restarting Meteor repeatedly is going to exhaust.
Are there other users experiencing this issue?
Set your project's Meteor version to a previous one:
meteor update --release 1.4.1.3
(Thanks to diaconutheodor)
Source
I am running meteor on a Mac using blaze templating. I have done the following steps and it has worked:
make sure that the import statement is in client/main.js and not in
server/main.js
make sure that 'blaze-html-templates' is installed
ensure that imports folder is typed correctly
Restart the server
If everything else fails, you can reset your project using 'meteor reset'
Hope this helps.
I'm working to cleanly structure my AngularJS app according to best practices, which includes separating the controllers and app into different script files.
Quick question: where should I put my factories and services? I am asking in the context of having factories & services that will be accessed outside of the scope of a single controller as well as having some that are within the scope of a single controller.
Update: the immediate answer below is no longer correct. Please see the latest addendum (written March 1, 2015) to this answer.
Got it! According to Brian Ford's article on Building Huuuuuuuge Angular Apps, the best practice appears to be to connect services and factories to the app in a separate file, like so:
root-app-folder
├── index.html
├── scripts
│ ├── controllers
│ │ └── main.js
│ │ └── ...
│ ├── directives
│ │ └── myDirective.js
│ │ └── ...
│ ├── filters
│ │ └── myFilter.js
│ │ └── ...
│ ├── services
│ │ └── myService.js
│ │ └── ...
│ ├── vendor
│ │ ├── angular.js
│ │ ├── angular.min.js
│ │ ├── es5-shim.min.js
│ │ └── json3.min.js
│ └── app.js
├── styles
│ └── ...
└── views
├── main.html
└── ...
(PSST! In case you're wondering, Brian Ford is part of the AngularJS team, so his answer seems pretty legit.)
Addition (April 24, 2013)
This just in: Yeoman is a fantastic tool for generating apps with the proper directory structure for big, functional Angular apps. It even has Grunt & Bower packed in!
Addendum (March 1, 2015)
According to a comment via PaoloCargnin, Google actually recommends a different structure, as detailed by this document. The structure should look like this:
sampleapp/
app.css
app.js //top-level configuration, route def’ns for the app
app-controller.js
app-controller_test.js
components/
adminlogin/
adminlogin.css //styles only used by this component
adminlogin.js //optional file for module definition
adminlogin-directive.js
adminlogin-directive_test.js
private-export-filter/
private-export-filter.js
private-export-filter_test.js
userlogin/
somefilter.js
somefilter_test.js
userlogin.js
userlogin.css
userlogin.html
userlogin-directive.js
userlogin-directive_test.js
userlogin-service.js
userlogin-service_test.js
index.html
subsection1/
subsection1.js
subsection1-controller.js
subsection1-controller_test.js
subsection1_test.js
subsection1-1/
subsection1-1.css
subsection1-1.html
subsection1-1.js
subsection1-1-controller.js
subsection1-1-controller_test.js
subsection1-2/
subsection2/
subsection2.css
subsection2.html
subsection2.js
subsection2-controller.js
subsection2-controller_test.js
subsection3/
subsection3-1/
etc...
I'm starting to develop with node.j,I meet an issue regarding the using of the module 'formidable'.
I have this error:
Error: Cannot find module 'formidable'
Here is the module list installed using 'npm ls installed' :
├─┬ express#2.5.9
│ ├── connect#1.8.7
│ ├── mime#1.2.4
│ ├── mkdirp#0.3.0
│ └── qs#0.4.2
├── formidable#1.0.9
├─┬ node-inspector#0.1.10
│ ├── paperboy#0.0.3
│ └─┬ socket.io#0.8.7
│ ├── policyfile#0.0.4
│ ├── redis#0.6.7
│ └─┬ socket.io-client#0.8.7
│ ├── uglify-js#1.0.6
│ ├── websocket-client#1.0.0
│ └── xmlhttprequest#1.2.2
├─┬ npm#1.1.21
│ ├── abbrev#1.0.3
│ ├── archy#0.0.2
│ ├── block-stream#0.0.5
│ ├── chownr#0.0.1
│ ├── fstream#0.1.18
│ ├─┬ fstream-npm#0.0.6
│ │ └── fstream-ignore#0.0.5
│ ├── graceful-fs#1.1.8
│ ├── inherits#1.0.0
│ ├── ini#1.0.2
│ ├── lru-cache#1.0.5
│ ├── minimatch#0.2.2
│ ├── mkdirp#0.3.0
│ ├─┬ node-gyp#0.4.1
│ │ ├── ansi#0.0.4
│ │ └── glob#3.1.9
│ ├── node-uuid#1.3.3
│ ├── nopt#1.0.10
│ ├── proto-list#1.0.0
│ ├── read#0.0.2
│ ├── request#2.9.153
│ ├── rimraf#2.0.1
│ ├── semver#1.0.13
│ ├── slide#1.1.3
│ ├── tar#0.1.13
│ ├── uid-number#0.0.3
│ └── which#1.0.5
└─┬ socket.io#0.9.6
├── policyfile#0.0.4
├── redis#0.6.7
└─┬ socket.io-client#0.9.6
├─┬ active-x-obfuscator#0.0.1
│ └── zeparser#0.0.5
├── uglify-js#1.2.5
├─┬ ws#0.4.14
│ ├── commander#0.5.2
│ └── options#0.0.3
└── xmlhttprequest#1.2.2
I add that it is the only module who generate this error.
Also, I don't really understand the way are encapsulated some module, it appears that npm is installing the module directly in the directory I'm using the module installation command, and I notice that formidable has been installed in the express/connect/ module on its first installation.
Can you give me more information about the module installation tree.
Thank for your replies
Cheers
The accepted answer looks very comprehensive and correct, but this worked for me:
npm install -d
d stands for dependencies (I think)
To understand module resolution, have a look at the Modules documentation, especially Loading from node_modules Folders.
For example, if the file at '/home/ry/projects/foo.js' called require('bar.js'), then node would look in the following locations, in this order:
/home/ry/projects/node_modules/bar.js
/home/ry/node_modules/bar.js
/home/node_modules/bar.js
/node_modules/bar.js
NPM takes advantage of this by installing modules into:
./node_modules/{module}
So, when you use npm install formidable, it will create and install the module into:
./node_modules/formidable
But, this means that only scripts within the current directory, including sub-directories, will succeed in using require('formidable'):
./foo.js
./lib/bar.js
./src/baz.js
./src/sub/qux.js
You can however install modules as "global," but you have to explicitly ask for it with -g or --global:
npm install -g formidable
Then, any script on the system should be able to require('formidable').
As for the tree output, you current have 5 installed modules available from the current directory:
express
formidable
node-inspector
npm
socket.io
Everything else in the tree is a list of these modules' dependencies, and their dependencies, etc., but only these 5 are available for require(...) within your scripts.