My project follows the following (simplified) directory structure:
\
|- app
|- script1.js
|- script2.js
|- test
|- intern.conf.js
|- test.spec.js
I'm using requirejs in my application and thus all scripts under app/ directory have their dependencies relative to that folder.
Because Intern baseUrl defaults to the root folder, the scripts under app/ fail to load.
However, setting the baseUrl under loader to 'app' or '/app' and so forth, results in failure to load the test suite..
Error: Failed to load module ../test/intern.conf from
test/intern.conf.js (parent: *2)
I tried to set the test suite location to '../test/test.spec.js' and so forth, with no success.
The baseUrl must be the base URL common to all modules, including test modules, so in your case would be the parent directory of the app and test directories. Normally this means that you will cd to the parent directory and simply run Intern from there, like intern-runner config=test/intern.conf, with no additional loader configuration necessary.
If you do need extra configuration (for example, to define app as a package), the loader configuration in your Intern configuration file doesn’t need to be the same as the loader configuration in your application, so in practice any difference between the two should never be an issue. You will have one configuration in your application entrypoint that works for your app, and one configuration in your test configuration that works for your test environment.
Relative AMD module IDs are relative to the module itself, so if your module app/script1 has a dependency ./script2, it will correctly load /root/app/script2.js, not /root/script2.js. When you load app/script1 from your test/test.spec module, so long as your baseUrl is the parent directory, you can either require ../app/script1 (if this makes sense, i.e. if the two are part of the same logical package) or app/script1 (if test and app are supposed to be two different packages).
I believe you may need to setup some paths in your requirejs configuration object. It will allow you to load in scripts outside of the baseUrl directory. So, you can still setup the baseUrl to be "app" while loading in your test directory though a path alias (http://requirejs.org/docs/api.html#jsfiles ).
In the example below both "app" and "test" are at the root along with the requirejs.config call, so using "/test" works. You could alternatively use "../" should files not be in the root.
requirejs.config({
baseUrl: "/app",
paths: {
"test" : "/test"
},
});
This would allow you to require a test file through:
define(["test/test.spec.js"], function(){ ... });
as it will use the "test" path to find out where that directory is.
Related
I would like put my worker.js under the same src/ directory as main.js, which loads the worker. (src/ is parallel to public/) However I got the following error if worker.js is under src/.
//in main.js
let worker = new Worker('./worker.js', {type:"module"});
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
However if I put worker.js under public/ (index.html is under public/), or any directory under public/, everything works fine. Seems like it can only load from public/ aka. http://<my domain>/worker.js , if it is under any directory parallel to public/, then it cannot find it, aka. http://<my domain>/../src/worker.js doesn't work. Am I right on this?
Plus, in worker.js, I cannot import any thing in node_modules/ like what I do for other js files in src/.
I assume these two questions are related. Could you please let me know the solutions?
(I am using worker-plugin, npm, react.)
thank you.
Based on your entry file, webpack tries to create a dependency tree. So it looks trough all the files that are being imported through a import/require statement, and then it tries to bundle your files into a single bundle. However, it does not happen with the worker constructor. Thus, webpack does not see your worker file as a dependency of your single bundle, and, therefore, it does not bundle it. So, to make this work, you can use a loader in you webpack configuration such as worker-loader (https://v4.webpack.js.org/loaders/worker-loader/), adding a rule in your webpack config file.
/foo
/bar.js
/foobar.js
/index.js
In node.js if you a require a directory (require('foo')), it would look into that directory and find an index.js file and return whatever exports I have in that file, so I can just bundle up the contents of the directory in an index.js file. Therefore, I dont have to require bar and foobar separately if index.js already includes them.
However this approach doesn't work with browserify. It seems like only thing browserify understands is relative paths.
/star
/star.js
/starfoo.js
/index.js
/foo
/bar.js
/foobar.js
/index.js
In other words I want to separate my project into submodules, call require on a directory as if I am calling require on a dependency. For example in the star.js file I want to be able to require('foo') and get the exports of bar.js and foobar.js (as long as /foo/index.js is importing bar.js and foobar.js)
edit:
Looking at the react source code, i think what i am describing is possible
https://github.com/facebook/react/blob/master/src/isomorphic/ReactIsomorphic.js
In this file they call require on React-Children in line 14.
var ReactChildren = require('ReactChildren');
However react children is couple directories deeper.
https://github.com/facebook/react/blob/master/src/isomorphic/children/ReactChildren.js
Where is this mapping defined?
There isn't a way to specify a base directory because that's not how node modules work. If you want non-relative paths, use the node_modules directory. If you want require('foo') to work from any directory, just make a symlink from your project root:
ln -s foo node_modules/foo
Trying to load module: grunt.loadNpmTasks('grunt-express-server'); from an external directory.
Get an error: task .... does not exist. Have you loaded it?
Directory structure:
client/
node_modules
gruntfile
dev_server/
node_modules/
grunt-express-server
So my question is: how do you run a grunt-task using a node-module which is stored in a external directory?
You will need to use grunt.task.loadtasks pointing it to the task directory which you want to load the tasks.
In your case:
grunt.loadTasks('../dev_server/node_modules/grunt-express-server/tasks');
If you check grunt's master on github, at line 325 of task.js it requires the taskfile (.../tasks/express.js) located in the filepath you passed as parameter.
// Load taskfile.
fn = require(path.resolve(filepath))
Edit
If you're wondering if you can relocate the grunt's path to node_modules, check out this question
The topic may seem to be duplicate. Read it completely
I know there are multiple packages available in nodejs to require all the files in a directory.
But I am in a research to require all the files in a folder and use the variables and functions which are exported in each js file. Need to perform this just by requiring the directory name.
For example,
var files = require("./folder");
The folder may contain some files like
File1.js, File2.js, File3.js
I want to use all the variables and functions which are exported in all the js files.
I think there might be some way in the "Package.json" file.
But I am not expert in "Package.json".
Can anyone help me to figure out the senario?
Could you just make an index.js file with the modules and just require that.
From the docs http://nodejs.org/api/modules.html#modules_loading_from_the_global_folders
It is convenient to organize programs and libraries into self-contained directories, and then provide a single entry point to that library. There are three ways in which a folder may be passed to require() as an argument.
The first is to create a package.json file in the root of the folder, which specifies a main module. An example package.json file might look like this:
{ "name" : "some-library",
"main" : "./lib/some-library.js" }
If this was in a folder at ./some-library, then require('./some-library') would attempt to load ./some-library/lib/some-library.js.
This is the extent of Node's awareness of package.json files.
If there is no package.json file present in the directory, then node will attempt to load an index.js or index.node file out of that directory. For example, if there was no package.json file in the above example, then require('./some-library') would attempt to load:
./some-library/index.js
./some-library/index.node
I would like to use the the node-bencoding package with my current RequireJS project setup, but I have been unable to get it configured.
I have followed these instructions and have ran:
npm install requirejs
npm install node-bencoding
Then in my app.js file I had changed it:
var requirejs = require('requirejs');
// Place third party dependencies in the lib folder
//
// Configure loading modules from the lib directory,
// except 'app' ones,
requirejs.config({
nodeRequire: require,
"baseUrl": "assets/js/lib",
"paths": {
"app": "../app",
"jquery": "https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min",
"angularjs": "https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min"
},
});
However when I load the page I get the error:
Error: Module name "requirejs" has not been loaded yet for context: _. Use require([]) http://requirejs.org/docs/errors.html#notloaded
I'm not exactly sure where I should have my node_modules directory. My directory structure is as follows: all my JS files are contained within src/assets/js - there is assets/js/app and assets/js/lib as is the RequireJS convention. Currently I have put my node_modules directory in src/.
Looks like you are trying to use it in a browser. And your application is not server side JavaScript, so RequireJS usage sample in a Node does not apply. In this case you would like to use node only to optimize your scripts.
I recently blogged about Understanding AMD & RequireJS, it might be useful.