Vue javascript and css obfuscation - vue.js

I'm working vue project. I was build it via vue-cli(Vue CLI v3.0.0-rc.3). I want obfuscate javascript files and css class names. When I was build my project I got an error:
Module build failed (from
./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from
./node_modules/postcss-loader/lib/index.js): Syntax Error
tsconfig.json
{
"compilerOptions": {
"outDir": "./dist/",
"target": "es5",
"module": "esnext",
"strict": true,
"strictNullChecks": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"noImplicitAny": true,
"allowJs": true,
"allowSyntheticDefaultImports": true,
"downlevelIteration": true,
"sourceMap": false,
"baseUrl": "./",
"types": [
"node",
"jest"
],
"paths": {
"#/*": [
"src/*"
]
},
"lib": ["es2016", "dom", "dom.iterable", "scripthost"]
},
"include": [
"src/**/*.ts",
"src/**/*.vue",
"tests/**/*.ts"
],
"exclude": [
"node_modules",
"**/*.spec.ts"
]
}
vue.config.js
const JavaScriptObfuscator = require('webpack-obfuscator');
module.exports = {
devServer: {
host: '0.0.0.0',
port: 80,
},
configureWebpack: {
plugins: [
new JavaScriptObfuscator ({
rotateUnicodeArray: true
})
],
module: {
rules: [
{
test: /\.css$/,
use: [
'vue-style-loader',
{
loader: 'css-loader',
options: {
modules: true,
localIdentName: '[local]_[hash:base64:8]'
}
}
]
}
]
}
}
};
package.json
{
"name": "tetris",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --open",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"animejs": "^2.2.0",
"axios": "^0.18.0",
"material-design-icons-iconfont": "^3.0.3",
"vue": "^2.5.16",
"vue-property-decorator": "^6.1.0",
"vue-router": "^3.0.1",
"vue-status-indicator": "^1.1.0",
"vuetify": "^1.0.19",
"vuex": "^3.0.1",
"vuex-class": "^0.3.1",
"vuex-router-sync": "^5.0.0"
},
"devDependencies": {
"#types/animejs": "^2.0.0",
"#types/jest": "^22.0.1",
"#vue/cli-plugin-babel": "^3.0.0-beta.6",
"#vue/cli-plugin-eslint": "^3.0.0-beta.15",
"#vue/cli-plugin-typescript": "^3.0.0-beta.15",
"#vue/cli-service": "^3.0.0-beta.15",
"#vue/eslint-config-airbnb": "^3.0.0-rc.3",
"#vue/eslint-config-prettier": "^3.0.0-beta.6",
"#vue/eslint-config-typescript": "^3.0.0-rc.3",
"babel-core": "^7.0.0-0",
"babel-preset-vue": "^2.0.1",
"node-sass": "^4.9.0",
"sass-loader": "^7.0.1",
"ts-jest": "^22.0.1",
"vue-template-compiler": "^2.5.16",
"uglifyjs-webpack-plugin": "latest",
"webpack-obfuscator": "latest"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}

Related

prettier ESLint circular errors

i am creating a vue component
but i am getting the following error
Type annotations can only be used in TypeScript files.
if i remove the type clause i then get
Missing return type on function.
the component looks like:
<template>
<pre>Market:{{ market }}</pre>
</template>
<script>
import Market from "./Market";
export default {
name: Market,
components: {},
data() { //<--- issue is reported here
return {
market: new Market(),
};
},
};
</script>
i'm guessing i have a conflict in prettier and eslints config so that one is treating vue as TS compatableand the other isn't
i've tried various tweaks and changes but nothing so far has made any diference so can any one point me to the correct config to resolve this?
tsconfig.json
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"types": [
"webpack-env"
],
"paths": {
"#/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}
babel.config.js
module.exports = {
presets: ["#vue/cli-plugin-babel/preset"],
};
settings,json
{
"editor.insertSpaces": false,
"editor.minimap.enabled": false,
"files.eol": "\n",
"workbench.sideBar.location": "right",
"php-cs-fixer.executablePath": "${extensionPath}\\php-cs-fixer.phar",
"launch": {
"configurations": [],
"compounds": []
},
"debug.javascript.usePreview": false,
"window.zoomLevel": 3,
"eslint.format.enable": true
}
packange.json
{
"dependencies": {
"core-js": "^3.6.5",
"vue": "^3.0.0",
"vue-class-component": "^8.0.0-0"
},
"devDependencies": {
"#typescript-eslint/eslint-plugin": "^4.18.0",
"#typescript-eslint/parser": "^4.18.0",
"#vue/cli-plugin-babel": "~4.5.0",
"#vue/cli-plugin-eslint": "~4.5.0",
"#vue/cli-plugin-typescript": "~4.5.0",
"#vue/cli-service": "~4.5.0",
"#vue/compiler-sfc": "^3.0.0",
"#vue/eslint-config-prettier": "^6.0.0",
"#vue/eslint-config-typescript": "^7.0.0",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^7.0.0",
"prettier": "^2.2.1",
"typescript": "~4.1.5"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended",
"#vue/typescript/recommended",
"#vue/prettier",
"#vue/prettier/#typescript-eslint"
],
"parserOptions": {
"ecmaVersion": 2020
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
I already had the same issue, fix it with:
<script lang="ts">
...
</script>
let me know if it works for you

How to configure vue project with custom configuration for prettier and eslint using vscode

When I save the project into VSCode I'm getting wrong break like into html tags, how to solve it? The error is explaned into the code / images down.
That is the non formated html.
<div class="a" :class="3" :data-option="2" :id="1" :title="'a'">Abcatece</div>
After run format getting that wrong formated Html Tags.
<div class="a" :class="3" :data-option="2" :id="1" :title="'a'"
>
Abcatece
</div
>
The formated html need to be in that way.
<div class="a" :class="3" :data-option="2" :id="1" :title="'a'">
Some text here
</div>
That is my configurations package.json and .prettierrc.js
Package.json
"name": "project-name",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"#coreui/coreui": "~3.0.0-beta.4",
"#coreui/icons": "^1.0.1",
"#coreui/icons-vue": "^1.3.1",
"#coreui/utils": "^1.2.2",
"#coreui/vue": "^3.0.0-beta.11",
"#fortawesome/fontawesome-free": "^5.13.0",
"#joeattardi/emoji-button": "^2.12.1",
"#microsoft/signalr": "3.1.3",
"#toast-ui/editor": "^2.0.1",
"axios": "^0.19.2",
"bootstrap": "^4.4.1",
"bootstrap-vue": "^2.9.0",
"highcharts": "^8.0.4",
"highcharts-vue": "^1.3.5",
"mic-recorder-to-mp3": "^2.2.1",
"uuid": "^7.0.2",
"vue": "^2.6.11",
"vue-i18n": "8.16.0",
"vue-notification": "1.3.20",
"vue-router": "^3.1.6",
"vue-select": "^3.9.5",
"vuex": "^3.1.3"
},
"devDependencies": {
"#vue/cli-plugin-babel": "^4.2.3",
"#vue/cli-plugin-eslint": "^4.2.3",
"#vue/cli-service": "^4.2.3",
"babel-eslint": "^10.1.0",
"#vue/eslint-config-prettier": "^6.0.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"core-js": "^3.6.4",
"eslint": "^6.8.0",
"prettier": "^2.0.2",
"eslint-plugin-prettier": "^3.1.2",
"eslint-plugin-vue": "^6.2.2",
"vue-template-compiler": "^2.6.11",
"sass-loader": "^8.0.2",
"node-sass": "^4.13.1"
},
"eslintConfig": {
"root": true,
"env": {
"browser": true,
"node": true,
"es6": true
},
"extends": [
"eslint:recommended",
"#vue/prettier",
"plugin:prettier/recommended",
"plugin:vue/recommended"
],
"rules": {
"no-unused-vars": [
"warn"
],
"vue/component-tags-order": [
"off",
{
"order": [
"template",
"script",
"style"
]
}
],
"vue/singleline-html-element-content-newline": [
"off",
{
"ignoreWhenNoAttributes": true,
"ignoreWhenEmpty": true
}
],
"vue/html-indent": "off",
"vue/html-self-closing": [
"warn",
{
"html": {
"normal": "any",
"void": "any",
"component": "any"
}
}
],
"vue/attribute-hyphenation": [
"off",
{
"ignore": []
}
],
"max-len": [
"warn",
{
"code": 120,
"ignoreComments": true
}
],
"vue/max-attributes-per-line": [
"warn",
{
"singleline": 4,
"multiline": {
"max": 1,
"allowFirstLine": true
}
}
]
},
"parserOptions": {
"parser": "babel-eslint"
}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}
.prettierrc.js
module.exports = {
tabWidth: 2,
tabs: false,
semi: true,
singleQuote: false,
quoteProps: "as-needed",
trailingComma: "none",
bracketSpacing: true,
jsxBracketSameLine: true,
arrowParens: "always",
endOfLine: "lf",
htmlWhitespaceSensitivity: "strict"
};

Installing jest & vue test utils manually no - trouble with import

I am trying to install vue-test-utils and jest in a project. It is vue-cli project but I did not setup the testing when I ran it initially.
It finds the test but fails on the import statements.
Here is the error.
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
It is almost certainly a babel thing (I think) but I cannot work it out.
Here are the config files.
babel.config.js
module.exports = {
presets: [
'#vue/app'
]
}
jest.config.js
module.exports = {
moduleFileExtensions: [
'js',
'jsx',
'json',
'vue'
],
transform: {
'^.+\\.vue$': 'vue-jest',
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
'^.+\\.jsx?$': 'babel-jest',
"^.+\\.js$": "<rootDir>/node_modules/babel-jest"
},
transformIgnorePatterns: [
'/node_modules/'
],
moduleNameMapper: {
'^#/(.*)$': '<rootDir>/src/$1'
},
snapshotSerializers: [
'jest-serializer-vue'
],
testMatch: [
'**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
],
testURL: 'http://localhost/'
}
package.json
{
"name": "test",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"test": "jest"
},
"dependencies": {
"core-js": "^2.6.5",
"vue": "^2.6.10",
"vue-moment": "^4.0.0"
},
"devDependencies": {
"#babel/core": "^7.4.3",
"#vue/cli-plugin-babel": "^3.6.0",
"#vue/cli-plugin-eslint": "^3.6.0",
"#vue/cli-service": "^3.6.0",
"#vue/test-utils": "^1.0.0-beta.29",
"babel-eslint": "^10.0.1",
"babel-jest": "^24.7.1",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"jest": "^24.7.1",
"jest-transform-stub": "^2.0.0",
"node-sass": "^4.11.0",
"sass-loader": "^7.1.0",
"vue-jest": "^3.0.4",
"vue-template-compiler": "^2.5.21",
"webpack": "^4.30.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
Well, looks like you need global section in your jest config. I'm using vue + ts, so my globals looks like that:
globals: {
'ts-jest': {
babelConfig: true
}
}

Switched from webpack.config.js to vue.config.js and VueLoaderPlugin is throwing an error when doing a build

We are switching our vue application over to use vue.config.js instead of webpack.config.js, and I am encountering some issues when trying to do a vue-cli-service build. The main error I am seeing is:
Error: [VueLoaderPlugin Error] No matching use for vue-loader is found.
Make sure the rule matching .vue files include vue-loader in its use.
For reference, here are our package.json, vue.config.js, and babel.config.js
I'm sure there are some things in the vue.config.js that could be cleaned up, but ignoring some of those things, I believe our VueLoaderPlugin should be set up correctly, and it was working in the webpack.config.js before getting moved over to vue.config.js
package.json
{
"name": "project-ui",
"version": "0.1.0",
"private": true,
"scripts": {
"start": "vue-cli-service serve",
"start-dev": "vue-cli-service serve --mode development",
"build-dev": "vue-cli-service build --mode development",
"build-stg": "vue-cli-service build --mode stage --dest dist-stage",
"build-prod": "vue-cli-service build --mode production --dest dist-prod",
"lint": "vue-cli-service lint",
"test": "jest"
},
"dependencies": {
"#babel/plugin-syntax-dynamic-import": "^7.2.0",
"axios": "^0.18.0",
"bootstrap": "^4.3.1",
"vue": "^2.6.10",
"vue-loader": "^15.7.0",
"vue-router": "^3.0.1",
"vuex": "^3.0.1"
},
"devDependencies": {
"#babel/core": "^7.0.0-rc.1",
"#babel/preset-env": "^7.0.0-rc.1",
"#vue/cli-plugin-babel": "^3.5.0",
"#vue/cli-plugin-eslint": "^3.5.0",
"#vue/cli-service": "^3.5.0",
"#vue/test-utils": "^1.0.0-beta.29",
"babel-core": "^6.26.3",
"babel-eslint": "^10.0.1",
"babel-jest": "^24.5.0",
"babel-loader": "^8.0.5",
"clean-webpack-plugin": "^2.0.1",
"cross-env": "^5.2.0",
"eslint": "^5.8.0",
"eslint-plugin-vue": "^5.0.0",
"file-loader": "^3.0.1",
"jest": "^24.5.0",
"jest-serializer-vue": "^2.0.2",
"mini-css-extract-plugin": "^0.5.0",
"node-sass": "^4.11.0",
"sass-loader": "^7.1.0",
"vue-jest": "^3.0.4",
"vue-template-compiler": "^2.5.21",
"webpack": "^4.29.6",
"webpack-cli": "^3.3.0",
"webpack-dev-server": "^3.2.1",
"webpack-merge": "^4.2.1",
"webpack-serve": "^3.0.0-beta.3"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"jest": {
"verbose": true,
"moduleFileExtensions": [
"js",
"vue"
],
"moduleNameMapper": {
"^#/(.*)$": "<rootDir>/src/$1"
},
"transform": {
"^.+\\.js$": "<rootDir>/node_modules/babel-jest",
".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
},
"snapshotSerializers": [
"<rootDir>/node_modules/jest-serializer-vue"
]
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
],
"description": "## Project setup ``` npm install ```",
"main": "babel.config.js",
"keywords": [],
"author": "",
"license": "ISC"
}
vue.config.js
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CleanWebpackPlugin = require('clean-webpack-plugin');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const env = require(process.env.VUE_APP_NODE_ENV === '' ? './.env' : './.env.' + process.env.VUE_APP_NODE_ENV);
const setPath = function(folderName) {
return path.join(__dirname, folderName);
}
const buildingForLocal = process.env.VUE_APP_NODE_ENV === 'local';
const extractHTML = new HtmlWebpackPlugin({
title: 'Project',
filename: 'index.html',
template: 'public/index.html',
inject: true,
minify: {
removeAttributeQuotes: true,
collapseWhitespace: true,
html5: true,
minifyCSS: true,
removeComments: true,
removeEmptyAttributes: true
},
environment: process.env.VUE_APP_NODE_ENV,
isLocalBuild: buildingForLocal,
imgPath: (!buildingForLocal) ? 'assets' : 'src/assets'
});
module.exports = {
publicPath: '/',
outputDir: buildingForLocal ? path.resolve(__dirname) : setPath(process.env.VUE_APP_DROP_LOCATION),
configureWebpack: {
entry: [
'./src/main.js'
],
output: {
filename: buildingForLocal ? '[name].js' : '[name].[hash].js'
},
resolve: {
extensions: ['.js', '.vue'],
alias: {
vue: buildingForLocal ? 'vue/dist/vue.js' : 'vue/dist/vue.min.js'
}
},
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
js: 'babel-loader'
}
}
},
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: [{
loader: "babel-loader",
options: { presets: ['#babel/preset-env'] }
}]
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
},
{
test: /\.svg$/,
loader: 'svg-sprite-loader'
},
{
test: /\.(png|jpg|gif)$/,
loader: 'file-loader',
query: {
name: '[name].[ext]?[hash]',
useRelativePath: buildingForLocal
}
}
]
},
plugins: [
extractHTML,
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
//filename: "css/styles.[hash].css",
//chunkFilename: "[id].css"
}),
new webpack.DefinePlugin({
'process.env': env
}),
new CleanWebpackPlugin(),
new VueLoaderPlugin()
],
optimization: {
splitChunks: false
},
mode: buildingForLocal ? 'development' : 'production'
},
devServer: {
historyApiFallback: true,
noInfo: false
}
};
babel.config.js
module.exports = {
"presets": [
["#babel/preset-env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}]
],
"plugins": ["#babel/plugin-syntax-dynamic-import"],
"env": {
"test": {
"presets": [
["#babel/preset-env", { "targets": { "node": "current" }}]
]
}
}
}

Angular 4 CLI cannot find name 'jasmine'

I am using the Angular 4 CLI (v.1.0.0) and to handle testing I created some mocks that use jasmine to create a spy. In the IDE everything looks okay, however in the terminal I am getting and error that says "Cannot find name 'jasmine'".
At first I thought the issue was that jasmine wasn't added to the typings but I can see that package.json includes the import for the jasmine type def so I'm not sure what is missing.
mocks.ts
export class MockAuthService {
public login: Function = jasmine.createSpy('login');
}
export class MockHttpService {
public delete: Function = jasmine.createSpy('delete');
public get: Function = jasmine.createSpy('get');
public post: Function = jasmine.createSpy('post');
public put: Function = jasmine.createSpy('put');
}
running ng serve returns the following error messages in the terminal.
ERROR in C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts
(2,23): Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (6,24):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (7,21):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (8,22):
Cannot find name 'jasmine'.
C:/Users/efarley/Desktop/repos/prod/src/app/mocks/mocks.ts (9,21):
Cannot find name 'jasmine'.
webpack: Failed to compile.
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/#types"
],
"lib": [
"es2016",
"dom"
]
}
}
tsconfig.spec.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}
tsconfig.app.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
package.json
{
"name": "prod",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^4.0.2",
"#angular/common": "^4.0.0",
"#angular/compiler": "^4.0.0",
"#angular/core": "^4.0.0",
"#angular/flex-layout": "^2.0.0-beta.8",
"#angular/forms": "^4.0.0",
"#angular/http": "^4.0.0",
"#angular/material": "^2.0.0-beta.3",
"#angular/platform-browser": "^4.0.0",
"#angular/platform-browser-dynamic": "^4.0.0",
"#angular/router": "^4.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
},
"devDependencies": {
"#angular/cli": "1.0.0",
"#angular/compiler-cli": "^4.0.0",
"#types/jasmine": "2.5.38",
"#types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-coverage-istanbul-reporter": "^0.2.0",
"protractor": "~5.1.0",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0"
}
}
You are getting the error because TypeScript is trying to include the mock in the app build, and the app (rightly) doesn't know about Jasmine.
Exclude the mock from your app compilation by adding it to the exclude array in tsconfig.app.json:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "es2015",
"baseUrl": "",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts",
"**/*.mock.ts"
]
}
I am not sure if you should be creating jasmine spys that way, but regardless:
The issue is with your file name
notice: tsconfig.spec.json has: "include": ["**/*.spec.ts","**/*.d.ts"]
and your file name is mocks.ts.
either change the file name to mocks.spec.ts
or add "**/*.mock.ts" and rename to something like service.mock.ts
Hope this helps.