I am trying to optimize my Durandal app but the main-built.js is blank.
I have tried running node r.js -o app.build.js and this threw an error saying that it could not find a file. I added these paths in my main.js file and each individual error went away. However, now the command above just exits with "Tracing dependencies for: durnadal/amd/almond.custom" and the file is still blank.
Question: Which libraries need to go into the paths below? It seems to the external libraries that I use in my index.html and it needs the exact file name?
require.config({
paths: {
"text": "durandal/amd/text",
"breeze": "lib/breeze/breeze.min",
"knockout": "lib/knockout/knockout.mapping-latest",
}
});
When I run Optimizer.exe in the Durandal AMD folder main-built.js is blank. This is the app.build.js file that is generated - any help appreciated on how to get more verbose logging with Almond. I have tried optimizer -verbose true with no luck.
{
"name": "durandal/amd/almond-custom",
"inlineText": true,
"stubModules": [
"durandal/amd/text"
],
"paths": {
"text": "durandal/amd/text"
},
"baseUrl": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App",
"mainConfigFile": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App\\main.js",
"include": [
"text!about.html",
"about",
"appNavigation",
"config",
"text!dareAdd.html",
"dareAdd",
"text!dareDetail.html",
"dareDetail",
"text!dareList.html",
"dareList",
"text!dareListItem.html",
"dataContext",
"dataService",
"dataServiceHelper",
"enums",
"errorWatcher",
"text!home.html",
"home",
"text!index.html",
"text!indextopcoat.html",
"indextopcoat",
"text!kendoIndex.html",
"text!loader.html",
"logger",
"text!login.html",
"login",
"main-built",
"main",
"text!menu.html",
"model",
"text!navbar.html",
"text!notifyOfError.html",
"notifyOfError",
"text!privacy.html",
"privacy",
"text!profile.html",
"profile",
"text!shell.html",
"shell",
"text!signup.html",
"signup",
"text!testpage.html",
"testpage",
"uiutilities",
"userState",
"viewModelHelper",
"text!walkthrough.html",
"walkthrough",
"widgetService",
"css/telerik/js/kendo.dataviz.min",
"css/topcoat/js/hello",
"css/topcoat/js/hello.min",
"css/topcoat/js/index",
"css/topcoat/lib/hello",
"css/topcoat/lib/vendor/ender.min",
"css/topcoat/lib/vendor/fastclick",
"durandal/app",
"durandal/composition",
"durandal/events",
"durandal/http",
"text!durandal/messageBox.html",
"durandal/messageBox",
"durandal/modalDialog",
"durandal/system",
"durandal/viewEngine",
"durandal/viewLocator",
"durandal/viewModel",
"durandal/viewModelBinder",
"durandal/widget",
"durandal/plugins/router",
"durandal/transitions/entrance",
"js/cordova",
"js/facebookscript",
"lib/bootstrap/bootstrap",
"lib/bootstrap/bootstrap.min",
"lib/breeze/breeze.debug",
"lib/breeze/breeze.intellisense",
"lib/breeze/breeze.min",
"lib/breeze/q",
"lib/breeze/q.min",
"lib/jquery/jquery-2.0.3.intellisense",
"lib/jquery/jquery-2.0.3",
"lib/jquery/jquery-2.0.3.min",
"lib/knockout/knockout-2.3.0.debug",
"lib/knockout/knockout-2.3.0",
"lib/knockout/knockout.mapping-latest.debug",
"lib/knockout/knockout.mapping-latest",
"lib/knockout/knockout.validation.debug",
"lib/knockout/knockout.validation",
"lib/moment/moment",
"lib/moment/moment.min",
"lib/ratchet/ratchet",
"lib/sammy/sammy-0.7.4",
"lib/sammy/sammy-0.7.4.min",
"lib/toastr/toastr",
"lib/toastr/toastr.min"
],
"exclude": [],
"keepBuildDir": true,
"optimize": "uglify2",
"out": "C:\\DNNDev.me\\DesktopModules\\Framework.App\\App\\main-built.js",
"pragmas": {
"build": true
},
"wrap": true,
"insertRequire": [
"main"
]
}
In your path you are setting your reference to knockout equal to the mapping plugin, which is no bueno.
As shown in this answer, Durandal.js optimizer not working (empty main-built.js) you can run it like Rainer shows and you should see a more specific error.
One thing that I found - if you remove a view model or use a folder or directory as a purgatory (about to be deleted) those files may not be used in your app but if they are in the file structure they will still be evaluated by the optimizer.
EDIT
Check here for more info on the optimizer - Tracking down optimizer issues in durandal.js
Also, are you building debug or release? Are you targeting the correct one? durandal optimizer references wrong path when building it as a post build process in Visual Studio
Also, if you are referencing Knockout.js, I think you mean to reference "lib/knockout/knockout-2.3.0" not the knockout mapping plugin.
Unless I am missing something you shouldn't have to add those paths to your main.js file. Breeze and Knockout should be referenced already. Depending on your project type, your editor, etc... it is probably bundled in your App.Start folder under DurandalBundleConfig. If it is not then are you just referencing the libraries from your index.html?
Move them into the bundle config if that is the case (something like this) -
bundles.Add(
new ScriptBundle("~/scripts/vendor")
.Include("~/Scripts/jquery-{version}.js")
.Include("~/Scripts/jquery-ui-{version}.min.js")
.Include("~/Scripts/knockout-{version}.js")
.Include("~/Scripts/sammy-{version}.js")
.Include("~/Scripts/bootstrap.min.js")
.Include("~/Scripts/knockout-bootstrap.min.js")
.Include("~/Scripts/Q.js")
.Include("~/Scripts/breeze.debug.js")
);
Note that you need to load Q prior to Breeze, as Breeze depends on Q.
Related
I want to disable rule for all files inside nested directory. I found examples only for exact path or by file extension. But it is not what I want.
We use it for shared config and don't know where this directory will be. We have many of them.
I'm trying config like this:
{
overrides: [
{
files: [
'**/test/**/*',
],
rules: {
"import/no-extraneous-dependencies": "off"
}
},
],
}
But glob like **/test/**/* and many others didn't not work.
Can someone help to reach this goal?
The above code should work.
How were you testing this? If it's an extension like VSCode you may need to refresh things to see latest definitions loaded.
If you are using a eslint service like esprint you will also need to restart it to grab latest definitions.
Caching
Make sure that eslint is not configured to cache results to avoid having to cache bust when debugging things. eslint docs
Here's an example for a react-native app with multiple overrides
module.exports = {
...baseConfig,
overrides: [
typescriptOverrides,
e2eOverrides,
themeOverrides,
{
files: ['**/*.style.js'],
rules: {
'sort-keys': [
'error',
'asc',
{
caseSensitive: true,
natural: true,
},
],
},
},
{
files: ['**/*.test.js'],
rules: {
'arrow-body-style': 'off',
},
},
],
};
Debugging the glob matcher
Run eslint in debug mode and see all the files being run example DEBUG=eslint:cli-engine npx eslint src/**/*.test.js
You can test your glob patterns by running a ls command. Example: ls ./src/**/*.test.js will either return all the files or 'no matches found'.
I am trying to use Jest on my windows 10 desktop computer, but it keeps telling me that there are no tests found. On my windows 10 laptop, it works just fine. Here is the output I am getting on my desktop:
C:\app> jest
No tests found
In C:\app
25163 files checked.
testMatch: **/__tests__/**/*.js?(x),**/?(*.)(spec|test).js?(x) - 743 matches
testPathIgnorePatterns: \\node_modules\\ - 25163 matches
Pattern: "" - 0 matches
In my package.json file, my jest config looks like this:
"jest": {
"collectCoverageFrom": [
"app/**/*.{js,jsx}",
"!app/**/*.test.{js,jsx}",
"!app/*/RbGenerated*/*.{js,jsx}",
"!app/app.js"
],
"coverageThreshold": {
"global": {
"statements": 98,
"branches": 91,
"functions": 98,
"lines": 98
}
},
"moduleDirectories": [
"node_modules",
"app",
"common"
],
"moduleNameMapper": {
".*\\.(css|less|styl|scss|sass)$": "<rootDir>/internals/mocks/cssModule.js",
".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/internals/mocks/image.js"
},
"setupTestFrameworkScriptFile": "<rootDir>/internals/testing/test-bundler.js"
}
I am using node 8.1.4 and jest v20.0.4
Any ideas on how to get jest to locate my tests?
I am not 100% sure its the same issue. But what solved it for me was to get rid of watchman (I added it in on path for another project that used relay). Try to run with --no-watchman (or set watchman: false in jest config)
Seeing this issue with Jest 24.8.0. It seems if you add --runTestsByPath it will correctly handle forward/backspaces,
There is a discussion of the issue https://github.com/microsoft/vscode-recipes/issues/205#issuecomment-533645097, with the following suggested VSCode debug configuration
{
"type": "node",
"request": "launch",
"name": "Jest Current File",
"program": "${workspaceFolder}/node_modules/.bin/jest",
"args": [
"--runTestsByPath", // This ensures the next line is treated as a path
"${relativeFile}", // This path may contain backslashes on windows
"--config",
"jest.config.js"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"disableOptimisticBPs": true,
"windows": {
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
}
}
For anyone attempting to find out how to fix this issue, this was a bug in Jest that was fixed in v22.
Changelog:
https://github.com/facebook/jest/blob/master/CHANGELOG.md (PR #5054)
If I run the console command
jest test/components/checkBox/treezCheckBox.test.js
the tests in that file are found and executed.
If I instead run the console command
jest test\components\checkBox\treezCheckBox.test.js
I get the error
No tests found, exiting with code 1
Run with `--passWithNoTests` to exit with code 0
In D:\treezjs
814 files checked.
testMatch: **/__tests__/**/*.[jt]s?(x), **/?(*.)+(spec|test).[tj]s?(x) - 44 matches
testPathIgnorePatterns: \\node_modules\\ - 814 matches
testRegex: - 0 matches
Pattern: test\components\checkBox\treezCheckBox.test.js - 0 matches
=> It seems to be important if forward or backward slashes are used.
Using doubled backward slashes works:
jest test\\components\\checkBox\\treezCheckBox.test.js
If you use a vscode launch configuration with a file path variable ${file}, the resulting system command unfortunately contains single "\" as separator.
Also see discussion and linked issues at https://github.com/Microsoft/vscode/issues/40256
(Last statement is outdated; ${relativeFile} also uses "\".)
Work around: Use a debug extension (e.g. Daddy Jest) instead of a custom launch configuration.
I have removed -- --watch from package.json where I wrote "test" : "jest -- --watch"
I'm trying to set up a Node.js + TypeScript project using Intern for testing. Everything works fine when I compile the project using "commonjs" (which I do for the normal build); and TypeScript is equally happy when compiling for "amd", which is required by Intern. However, when passing the tests with intern-client, it complains about a couple of things:
First, imports from "index.ts" files (so-called "barrel" modules) won't work. My setup is something like this (everything in the same directory):
// index.ts
export { x } from './x'
// x.ts
export function x() {}
// x.test.ts
import { x } from '.' // "Error: Failed to load module ..."
In fact, the generated JavaScript code (for x.test.ts) looks something like this:
define(["require", "exports", "."], function (...) { ... })
And I'm not sure that AMD knows how to handle the ".".
The second issue happens under the same circumstances (TypeScript compiles happily, but intern-client complains). In summary, I get an error when doing:
import jsdom = require('jsdom')
Which I need to transform to:
const jsdom = require('jsdom')
For Intern to be able to deal with it.
Here is the tsconfig.json file I use to compile the tests:
{
"compilerOptions": {
"target": "es6",
"module": "amd",
"moduleResolution": "node",
"sourceMap": true,
"rootDir": "src",
"outDir": "build/tests",
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
}
And here is my intern.js configuration file, in case it helps:
define({
suites: ['build/tests/**/*.test.js'],
excludeInstrumentation: true,
filterErrorStack: true
})
Edit (2017-05-03)
To help understand the issue, here is an excerpt of the directory tree of the project:
build
tests // The compiled tests will end up here
src
core
utils
x.ts
x.test.ts
// Other files, each containing a function that I would like to unit-test...
intern.js
package.json
tsconfig.json
...
Regarding the first issue, AMD's handling of an import like '.' is different than Node's. While both of them will map '.' to a package, Node uses a default module name of index.js, while AMD uses main.js. To get things working in an AMD loader, you'll need to first define a package for '.', and then tell the AMD loader what default module to use for that package. Given your project layout, you could configure Intern like this:
loaderOptions: {
map: {
// When a module in src/ references 'src/utils', redirect
// it to 'utils'
'src': {
'src/utils': 'utils'
}
},
packages: [
// Define a package 'utils' with files in 'src/utils' that defaults
// to the module index.js
{ name: 'utils', location: 'src/utils', main: 'index.js' }
]
}
Regarding the second issue, its not clear what the problem actually is. Import statements will be transpiled into define dependencies by TypeScript, so Intern should never be seeing them.
I am very confused at to what the difference is between the "bundles" property and the "modules" property in a r.js build file that might look something like:
({
"allowSourceOverwrites": false,
"preserveLicenseComments": false,
"findNestedDependencies": false,
"optimizeAllPluginResources": true,
"dir":"../public/bundles",
"baseUrl": "../public/static",
"optimize":"none",
"mainConfigFile": "../public/static/app/js/main.js",
"normalizeDirDefines": "all",
"paths" :{
requireLib : 'vendor/require',
jqueryUI: "empty:",
jqueryUICSS: "empty:"
},
"modules": [
{
name: "shared",
include: [
'jquery',
'async',
'backbone'
],
exclude:[]
}
],
"bundles": {
'shared': [],
'secondary': []
},
"stubModules":['text']
})
I am having a lot of trouble finding good information on how to create multiple bundles for a RequireJS project. When I just use the modules property and eliminate the bundles property, r.js goes looking for a file called shared.js - and I am not sure why.
r.js creates bundles, but the bundles option is not an option that r.js recognizes. If you look in the file that lists all r.js options, you won't find bundles there. If you remove it from your configuration, you'll get the same behavior.
When I just use the modules property and eliminate the bundles property, r.js goes looking for a file called shared.js - and I am not sure why.
r.js looks for shared.js because your modules specifies a module named "shared". r.js will do this unless you tell it that you want to create this module from scratch, and you do this by adding the create: true option to this module's build configuration:
"modules": [
{
name: "shared",
create: true, // <<<--- add this!
include: [
'jquery',
'async',
'backbone'
],
exclude:[]
}
],
I have been able to get webpack to look for components inside bower_components. I'm running in to issues when a bower component only includes .bower.json and not a bower.json file (notice that the first filename is preceded by a .).
A simplified version of my webpack.config.js file looks as follows:
var ResolverPlugin = require('webpack/lib/ResolverPlugin');
// webpack configuration
module.exports = {
entry: {
app: 'app.js'
},
output: {
filename: '[name].js'
},
resolve: {
modulesDirectories: ['node_modules', 'web_modules', 'bower_components', 'static']
},
plugins: [
new ResolverPlugin(
new ResolverPlugin.DirectoryDescriptionFilePlugin('bower.json', ['main'])
)
]
};
I'm trying to use jquery.selectBoxIt as a bower component. Another issue might be that its lacking a main field in its .bower.json file. For what it's worth, I've included that file below:
// .bower.json
{
"name": "jquery.selectBoxIt",
"homepage": "https://github.com/gfranko/jquery.selectBoxIt.js",
"version": "3.8.1",
"_release": "3.8.1",
"_resolution": {
"type": "version",
"tag": "v3.8.1",
"commit": "ffa615b25ebf4fac392726b17c857d429acf244c"
},
"_source": "git://github.com/gfranko/jquery.selectBoxIt.js.git",
"_target": "~3.8.1",
"_originalSource": "jquery.selectBoxIt",
"_direct": true
}
.bower.json is a file generated by Bower during dependency resolution. It is not equivalent to bower.json and generally should not be used as it is an internal file which may change.
In cases where you see only a .bower.json file it means that the package does not have a bower.json (Bower can actually work without it). In such cases it means that you will not be able to find the "main" property.
For example the jquery.selectBoxIt.js package has bower.json file only in their master branch but not in their release tags (it was probably not released yet). When you resolve it, Bower will use the 3.8.1 git tag as you can see in the .bower.json file. In this tag there is no bower.json file.
For such packages you may want to consider another option such as CommonsJS.