Hi I am having trouble running jasmine because it cannot find the spec files.
my jasmine.json which is in the root folder is this
```
{
"spec_dir": "test",
"spec_files": [
"integration-testing/*.spec.js"
],
"helpers": [
"helpers/**/*.js"
],
"stopSpecOnExpectationFailure": false,
"random": false
}
```
and my folder structure is this
Try doing "**/*[sS]pec.js" for spec files and use the capital or lowercase 's' depending on what the 's' is in your file.
Related
my class from variable is not working, im sure its mix problem.
<div class="rounded bg-gradient-to-r {{$replay->playerOneTeam()}}">
Team: {{ $replay->playerOneTeam()}}
</div>
It seems like purgeCSS or something is removing class "from-red-400". When I set it manually and do npm run dev it works, but when it's used from variable, it's not loading. The class is in code when I inspect but the code runs like it doesn't exist.
Check your tailwind.config.js file and look for something like this:
module.exports = {
mode: 'jit',
purge: [
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
'./vendor/laravel/jetstream/**/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
'./resources/js/**/*.vue',
],
// ...
}
In this example, JIT mode is enabled and purge is where you can specify files where to look for used Tailwind CSS classes. From here, you have three options:
[Not recommended] Disable JIT mode.
Follow the guidelines here to make sure the compiler sees your class name in those files you specified, i.e. to write purgeable HTML code in those files.
Divide purge into content and safelist so the compiler doesn't accidentally remove your classes specified there (which will be classes that do not appear explicitly in purgeable HTML code).
Using the example above, the third option would look something like this:
module.exports = {
mode: 'jit',
purge: {
content: [
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
'./vendor/laravel/jetstream/**/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
'./resources/js/**/*.vue',
],
safelist: [
'from-red-400', // this is the class you wanted
// ... some other classes you may need
'bg-blue-500', // example class
'text-center', // example class
'hover:opacity-100', // example class
]
},
// ...
}
in 2023, if someone has the same problem, this was the solution that I found working:
Add this in tailwind.config.js
safelist: [
'bg-blue-100',
{
pattern: /bg-(gray|red|orange|amber|yellow|green|lime|blue|sky|teal|indigo|violet|purple|pink)-(50|100|200|300|400)/,
},
{
pattern: /text-(gray|red|orange|amber|yellow|green|lime|blue|sky|teal|indigo|violet|purple|pink)-(500|600|700|800)/,
},
],
The #nuxtjs/style-resources module isn't importing my scss files. I have a special folder structure to generate multiple websites from one Nuxt project, I think this might cause the problem.
This is what my folder structure looks like:
/
package.json
/src
/site-one
/site-two
/shared
nuxt.config.js
/assets
/scss
imports.scss
This is what my nuxt.config file in /shared looks like:
modules: [
'#nuxtjs/style-resources',
],
styleResources: {
scss: [
'./assets/scss/imports.scss',
]
},
I tried '~assets/scss/imports.scss' without success.
I also tried making an alias like so:
build: {
...
extend(config, ctx) {
config.resolve.alias['~sharedPath'] = __dirname
}
}
and using a path like this: '~sharedPath/assets/scss/imports.scss' but that doesn't seem to work either.
I'm not sure what else I can try to make #nuxtjs/style-resources import my scss files, please help.
I fixed it like so:
modules: [
'#nuxtjs/style-resources',
],
styleResources: {
scss: [
__dirname + '/assets/scss/imports.scss',
]
},
Short syntax of passing in config didn't work for me:
Does not work:
modules:[
[
'#nuxtjs/style-resources', {
scss: [ "~css/variables.scss"],
}
]
]
Works:
modules: ["#nuxtjs/style-resources"],
styleResources: {
scss: ["~css/variables.scss"]
},
I'm having trouble with using the env variable TS_NODE_PROJECT when ts-node is used for testing using Mocha.
The project structure looks like this:
src/
main_test.ts
tsconfig.json
package.json
In my test, I want to use an async function, which requires "lib": ["es2018"] as a compilation option.
// src/main_test.ts
describe('', () => {
it('test', () => {
(async function() {})()
});
});
// src/tsconfig.json
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"sourceMap": true,
"lib": ["es2018"]
},
"exclude": [
"../node_modules"
]
}
To run the test, I use this command, but it results in an error:
TS_NODE_PROJECT='src' && mocha --require ts-node/register src/*_test.ts
# TSError: тип Unable to compile TypeScript:
# error TS2468: Cannot find global value 'Promise'.
# src/main_test.ts(3,10): error TS2705: An async function or method in ES5/ES3 requires the 'Promise' constructor. Make sure you have a declaration for the 'Promise' constructor or include 'ES2015' in your `--lib` option.
This means that src/tsconfig.json is not used. According to Overriding `tsconfig.json` for ts-node in mocha
and the ts-node documentation, the command should pass the correct tsconfig.json path to ts-node.
Moving src/tsconfig.json to project directory and running the same command causes the test to succeed. How can I pass the tsconfig.json path to ts-node so that the test compiles correctly?
Oh. How embarrassing...
TS_NODE_PROJECT='src/tsconfig.json' mocha --require ts-node/register src/*_test.ts
I find very useful to move mocha setup in different files so package.json remains clean, you can use a mocharc file like this:
module.exports = {
ignore: [
'./test/helpers/**/*',
'./test/mocha.env.js'
],
require: [
'test/mocha.env', // init env here
'ts-node/register'
],
extension: [
'ts'
]
}
and then create the file test/mocha.env.js (or call it as you wish) with this content:
process.env.NODE_ENV = 'test'
process.env.TS_NODE_PROJECT = 'src/tsconfig.json'
We have a need to deploy scss files to dist directory when angular is building. I am fully aware that only css should be deployed after the build however we have custom need to read the scss file on run time and perform certain action.
I tried adding below line (last line under scripts:) in angular.json file but that did not help. I cant find any file deploying during debug.
"build": {
"builder": "#angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/scss/styles.scss"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/bootstrap/dist/js/bootstrap.js",
"src/scss/_custom-variables.scss"
]
},
"assets": [
"src/favicon.ico",
"src/assets",
"src/scss/_custom.scss"
],
Adding this under assets in angular.json file works for me. I was looking under wrong folder.
Out of the box; angular 6 does not provide a way to do this natively. However; you can achieve what you are describing by using custom webpack configuration that utilizes Angular 6 builders.
For example, you can use Custom Webpack Builder. Due to the nature of builders,their configuration is merged with CLI own configuration, so all you need to do is to create a minimalistic configuration utilizing Webpack Copy Plugin; then use glob patterns to catch & copy all required .scss files to dist/ directory.
You can try to fiddle with similar webpack configuration:
"use strict";
const CopyWebpackPlugin = require("copy-webpack-plugin");
module.exports = {
plugins: [
new CopyWebpackPlugin([
{
from: "src/app/**/*.scss",
to: "dist/app/"
}
]
)
]
};
Alternatively; if you do not require ejected SCSS during development and only in production package, you can use simple Gulp task to copy the files
"use strict";
let gulp = require("gulp");
gulp.task("copy:styles", () =>
gulp.src(["src/app/**/*.scss"])
.pipe(gulp.dest("dist/app/")));
SublimeText has a project-settings file that includes a folder_include_patterns option.
I have a folder called (my app name).project-settings (which according to some research, is the correct name for the file) in the top level of my project. I am trying to make Sublime not show all the files under node_modules except my-module:
{
"folders": [
{
"path": "node_modules",
"folder_include_patterns": [
"my-module"
]
}
]
}
However SublimeText still shows all the files under node_modules. How can I make a Sublime Text project file to only show certain folders?
I assume you don't want to ignore all the other modules in node_modules.
You could ignore your node_modules directory and include your module as another folder.
{
"folders":
[
{
"folder_exclude_patterns":
[
"node_modules",
],
"path": "."
},
{
"path": "node_modules/mymodule"
},
]
}
My syntax is correct, but making the file isn't enough to make a dir into a project.
Since there is no 'new project' button in Sublime, you can make a folder with:
Open the folder in Sublime.
Click Project > Save Project As
This makes:
your_project.sublime-project
{
"folders": [
{
"path": "."
},
{
"path": "node_modules",
"folder_include_patterns": [
"my-module"
]
}
]
}
your_project.sublime-workspace (left as defaults)
Additionally: you must open the project from the Project menu (otherwise it will still be a folder and ignore the .sublime-project file).