I'm doing a custom build with dojo 1.6.1.
I get this error: ReferenceError: dojo is not defined.
I reduced the profile to a simple file like this:
dependencies ={
layers: [
{
name: "myRelease.js",
dependencies: [
"dijit._Widget",
"dijit._Templated"
]
}
],
prefixes: [
[ "dijit", "../dijit" ]
]
};
but I still get the same error.
Why is dojo undefined? what am I doing wrong?
THanks
Add the following script to HTML to add DOJO build support
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/dojo.js"></script>
Related
I have been trying this for a while now, without success.
I have an expo app and I am using cypress to test some use cases using the web version of the app (generated by expo).
However, I would like to generate some code coverage as well. I have read the official documentation for it, that recommends to babel-plugin-istanbul do to so, but it does not seem to work with expo.
I am not sure why this would not work.
Edit
I removed the files previously pointed here as they were not important.
Thanks for a wonderful documentation provided by a hero without a cape, I figured that my settings were wrong.
All I needed to do was:
install babel-plugin-istanbul
Update babel.config.js
module.exports = {
presets: ['babel-preset-expo'],
plugins: [
'istanbul',
[
'module-resolver',
{
root: ['.'],
extensions: [
'.js',
],
alias: {
'#': './',
},
},
],
],
};
update cypress/support/index.js
import '#cypress/code-coverage/support';
update cypress/plugins/index.js
module.exports = (on, config) => {
require('#cypress/code-coverage/task')(on, config);
// add other tasks to be registered here
// IMPORTANT to return the config object
// with the any changed environment variables
return config;
};
and voilà!
For every element that I have defined in a Polymer 2.x project I get the following warning:
Multiple global declarations of class with identifier Polymer.Element
The build ultimately fails with a Promise rejection at ...\node_modules\polymer-build\lib\analyzer.js
Are these components improperly defined?
How can I properly build the project?
My polymer.json file is
{
"entrypoint": "index.html",
"shell": "src/shop-app.html",
"fragments": [
"src/lazy-resources.html"
],
"sources": [
"src/**/*",
"data/**/*",
"images/**/*",
"app.yaml",
"bower.json",
"manifest.json",
"sw-precache-config.js",
"Web.config"
],
"extraDependencies": [
"manifest.json",
"bower_components/webcomponentsjs/webcomponents-lite.js"
],
"lint": {
"rules": ["polymer-2-hybrid"]
},
"builds": [{
"js": {"minify": true},
"css": {"minify": true},
"html": {"minify": true}
}]
}
This error means that you load the same dependency from two different urls. For instance
myStuff/myApp.html
myOtherStuff/myApp.html
I had the same warning while building my Polymer 2 app. Probably because some of my elements import the same other elements and all of them extend Polymer.Element. I have checked all my elements for duplicate imports. Maybe some third party elements have duplicates, but my elements didn't.
So I added the warning to the ignore list in polymer.json:
{
"lint": {
"rules": [
"polymer-2"
],
"ignoreWarnings": ["multiple-global-declarations"]
},
...
}
I too had same warning and it was gone after cleaning bower_components and node_modules.
I am trying to import the data from a .json file in a .tsx using following:
import data from "data/mockup.json"
but I got the error
Cannot find module 'data/mockup.json'
My webpack config looks like this:
const babelLoader = {
loader: 'babel-loader',
options: {
cacheDirectory: true,
presets: [
["#babel/preset-env", {
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
},
"modules": true
}]
]
}
};
module.exports = {
entry: {...},
resolve: {
extensions: ['.ts', '.tsx', '.js', '.json'],
alias: {
data: path.resolve(__dirname, 'src/app/data')
}
},
output: {...},
module: {
rules: [
{
test: /\.tsx?$/,
exclude: /node_modules/,
use: [
babelLoader,
{
loader: 'ts-loader'
}
]
},
{
test: /\.js$/,
exclude: /node_modules\/(?!(dom7|swiper)\/).*/,
use: [
babelLoader
]
}
]
},
...
}
enter code here
I think the .json is built in webpack4 by default so there may be something wrong with my webpack config?
Version used:
webpack: v4.4.1
typescript: 2.7.2
declare module in d.ts file
declare module "*.json"
Add a field in tsconfig.json in compiler options
"typeRoots": [ "node_modules/#types", "./typings.d.ts" ],
Now import into file (.tsx)
import * as data from "./dat/data.json";
Webpack#4.4.1 and Typescript#2.7.2
Hope this helps!!!
Ref1: https://www.typescriptlang.org/docs/handbook/react-&-webpack.html
Ref2: https://github.com/Microsoft/TypeScript-React-Starter/issues/12
Although answers are helpful to load the JSON file as a module, they are limited in many aspects
First: the typescript can load by default JSON files, you only need to add into tsconfig.json below line:
{
...
"resolveJsonModule": true,
...
}
second: the suggested solution will enable implicitly for type check and auto-completion
P.S. the attached image is from a tutorial that talks about the same subject click here to check more
Personnaly, uncommenting :
"allowSyntheticDefaultImports": true /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */,
in the file tsconfig.json did the trick.
I found the hint here.
I have a Django app and am using Django's i18n module to help translating my strings. For translating JavaScript, I run
python manage.py makemessages -d djangojs
which adds all marked strings to a .po file. This works quite well for all my boring .js files in my static folder. However, we are starting to use webpack to pack some typescript (.tsx files) into a bundle.js file. This file is copied to the static folder after building, so I expected Djangos makemessages to pick up the strings from it as well. However, it seems that the strings are not parsed correctly, because most of the code in bundle.js is simply strings wrapped in eval().
I believe this means that I need webpack to - in addition to the bundle.js file - create a .js file for each .tsx file without all of the eval() nonsense, so that django's makemessages can parse it properly. I have no idea how to do this, however. My current config looks like this
var path = require("path");
var WebpackShellPlugin = require('webpack-shell-plugin');
var config = {
entry: ["./src/App.tsx"],
output: {
path: path.resolve(__dirname, "build"),
filename: "bundle.js"
},
devtool: 'source-map',
resolve: {
extensions: [".ts", ".tsx", ".js"]
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: "ts-loader",
exclude: /node_modules/
},
{
test: /\.scss$/,
use: [{
loader: "style-loader" // creates style nodes from JS strings
}, {
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "sass-loader" // compiles Sass to CSS
}]
},
{
test: /\.css$/,
loader: 'style-loader!css-loader'
}
]
},
plugins: [
new WebpackShellPlugin({
onBuildEnd:['./cp_to_static.sh'],
dev: false // Needed to trigger on npm run watch
})
]
};
module.exports = config;
So how can I make webpack spit out these files?
Is this the right thing to do, or is there a way to make Django parse bundle.js properly?
Turns out that all of the eval nonsense was generated by webpacks "watch" function. When simply running webpack for building the script, it works as expected
I am new to JavaScript unit testing. I am trying to test typescript classes and my tests are also written in typescript, which somewhat looks like below:
/// <reference path="../../typings/qunit/qunit.d.ts" />
import Utility1 = require("../utility");//This is script I want to test.
test("utility_test",function() {
...
var result = ...;
var expected = ...;
equal(result, expected, "Test failed");
})
I am using VS 2015 with chutzpah test adapter installed as shown here. To be clear I have installed this to extension to vs 2015: Chutzpah Test Runner Context Menu Extension, and Chutzpah Test Adapter for the Test Explorer and also added Chutzpah NuGet package.
Yet when I build my project, the test doesn't appear in the Test Explorer. And when I tried to run the test from context menu, it fails with this error: Error: Error: Called start() outside of a test context while already started.
Can anyone please let me know where I am going wrong?
EDIT
For the one looking for the solution with require.js, this here worked for me. Now my Chutzpah.json looks like below:
{
"Framework": "qunit",
"CodeCoverageExcludes": [ "*/require.config.js" ],
"TestHarnessReferenceMode": "AMD",
"TestHarnessLocationMode": "SettingsFileAdjacent",
"TypeScriptModuleKind": "AMD",
"AMDBaseUrl": "",
"EnableTestFileBatching": true,
"Compile": {
"Mode": "External",
"Extensions": [ ".ts" ],
"ExtensionsWithNoOutput": [ ".d.ts" ]
},
"References": [
{ "Path": "require.js" },
{ "Path": "require.config.js" },
],
"Tests": [
{ "Path": "jsTests" }
]
}
Chutzpah no longer bundles the Typescript compiler inside of it (as of version 4). You must tell Chutzpah where to find your generated .js files (or/and how to compile them if you want it to).
See the documentation for the Compile setting
as well as these code samples.
Most people will use the external compile mode when working with Visual Studio since VS can compile the .ts files for you and you just need to tell Chutzpah where to find them. That will look like this:
{
"Compile": {
"Mode": "External",
"Extensions": [".ts"],
"ExtensionsWithNoOutput": [".d.ts"]
},
"References": [
{"Includes": ["*/src/*.ts"], "Excludes": ["*/src/*.d.ts"] }
],
"Tests": [
{ "Includes": ["*/test/*.ts"], "Excludes": ["*/test/*.d.ts"] }
]
}