Angular - Adding -js fle getting Uncaught SyntaxError: Unexpected string
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I have an angular 6 app, I'm trying to setup my own style library...
This is how looks angular.json file:
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/adm-auth-frontend",
"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/scss/bootstrap.scss",
"src/styles.scss"
],
"scripts": [
"src/assets/scripts/index.js"
]
},
"configurations": {
As you can see, the project was setup with sass and its working good.
The problem is that I need some scripts files, I've added those files on the scripts sections but when I run execute ng serve get the following error and still now working :(
See error
I've tried to add it on webpack config file by using ng eject but..
The 'eject' command has been temporarily disabled, as it is not yet compatible with the new angular.json format. The new configuration format provides further flexibility to modify the configuration of your workspace without ejecting. Ejection will be re-enabled in a future release of the CLI.If you need to eject today, use CLI 1.7 to eject your project.
index.js file:
@import './spec/settings/index.scss';
@import './spec/tools/index.scss';
@import 'bootstrap/scss/bootstrap.scss';
@import './spec/index.scss';
@import './vendor/index.scss';
How can I add these .js files?
javascript angular sass
add a comment |
I have an angular 6 app, I'm trying to setup my own style library...
This is how looks angular.json file:
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/adm-auth-frontend",
"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/scss/bootstrap.scss",
"src/styles.scss"
],
"scripts": [
"src/assets/scripts/index.js"
]
},
"configurations": {
As you can see, the project was setup with sass and its working good.
The problem is that I need some scripts files, I've added those files on the scripts sections but when I run execute ng serve get the following error and still now working :(
See error
I've tried to add it on webpack config file by using ng eject but..
The 'eject' command has been temporarily disabled, as it is not yet compatible with the new angular.json format. The new configuration format provides further flexibility to modify the configuration of your workspace without ejecting. Ejection will be re-enabled in a future release of the CLI.If you need to eject today, use CLI 1.7 to eject your project.
index.js file:
@import './spec/settings/index.scss';
@import './spec/tools/index.scss';
@import 'bootstrap/scss/bootstrap.scss';
@import './spec/index.scss';
@import './vendor/index.scss';
How can I add these .js files?
javascript angular sass
add a comment |
I have an angular 6 app, I'm trying to setup my own style library...
This is how looks angular.json file:
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/adm-auth-frontend",
"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/scss/bootstrap.scss",
"src/styles.scss"
],
"scripts": [
"src/assets/scripts/index.js"
]
},
"configurations": {
As you can see, the project was setup with sass and its working good.
The problem is that I need some scripts files, I've added those files on the scripts sections but when I run execute ng serve get the following error and still now working :(
See error
I've tried to add it on webpack config file by using ng eject but..
The 'eject' command has been temporarily disabled, as it is not yet compatible with the new angular.json format. The new configuration format provides further flexibility to modify the configuration of your workspace without ejecting. Ejection will be re-enabled in a future release of the CLI.If you need to eject today, use CLI 1.7 to eject your project.
index.js file:
@import './spec/settings/index.scss';
@import './spec/tools/index.scss';
@import 'bootstrap/scss/bootstrap.scss';
@import './spec/index.scss';
@import './vendor/index.scss';
How can I add these .js files?
javascript angular sass
I have an angular 6 app, I'm trying to setup my own style library...
This is how looks angular.json file:
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/adm-auth-frontend",
"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/scss/bootstrap.scss",
"src/styles.scss"
],
"scripts": [
"src/assets/scripts/index.js"
]
},
"configurations": {
As you can see, the project was setup with sass and its working good.
The problem is that I need some scripts files, I've added those files on the scripts sections but when I run execute ng serve get the following error and still now working :(
See error
I've tried to add it on webpack config file by using ng eject but..
The 'eject' command has been temporarily disabled, as it is not yet compatible with the new angular.json format. The new configuration format provides further flexibility to modify the configuration of your workspace without ejecting. Ejection will be re-enabled in a future release of the CLI.If you need to eject today, use CLI 1.7 to eject your project.
index.js file:
@import './spec/settings/index.scss';
@import './spec/tools/index.scss';
@import 'bootstrap/scss/bootstrap.scss';
@import './spec/index.scss';
@import './vendor/index.scss';
How can I add these .js files?
javascript angular sass
javascript angular sass
asked Nov 16 '18 at 19:48
D. GarcésD. Garcés
1
1
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Angular scripts added on angular.json file are run only once
when angular took over the application it will read those scripts once and loaded
so it is not recommend to use js files with angular cus they are not functioning again unless manually re-triggered upon change to the HTML.
instead use typescript libraries like ng-bootstrap or
Temporary solution is add manual tag on index.html,
this worked but isn't good enough.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53344443%2fangular-adding-js-fle-getting-uncaught-syntaxerror-unexpected-string%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Angular scripts added on angular.json file are run only once
when angular took over the application it will read those scripts once and loaded
so it is not recommend to use js files with angular cus they are not functioning again unless manually re-triggered upon change to the HTML.
instead use typescript libraries like ng-bootstrap or
Temporary solution is add manual tag on index.html,
this worked but isn't good enough.
add a comment |
Angular scripts added on angular.json file are run only once
when angular took over the application it will read those scripts once and loaded
so it is not recommend to use js files with angular cus they are not functioning again unless manually re-triggered upon change to the HTML.
instead use typescript libraries like ng-bootstrap or
Temporary solution is add manual tag on index.html,
this worked but isn't good enough.
add a comment |
Angular scripts added on angular.json file are run only once
when angular took over the application it will read those scripts once and loaded
so it is not recommend to use js files with angular cus they are not functioning again unless manually re-triggered upon change to the HTML.
instead use typescript libraries like ng-bootstrap or
Temporary solution is add manual tag on index.html,
this worked but isn't good enough.
Angular scripts added on angular.json file are run only once
when angular took over the application it will read those scripts once and loaded
so it is not recommend to use js files with angular cus they are not functioning again unless manually re-triggered upon change to the HTML.
instead use typescript libraries like ng-bootstrap or
Temporary solution is add manual tag on index.html,
this worked but isn't good enough.
answered Nov 16 '18 at 20:12
H-a-NeoH-a-Neo
826
826
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53344443%2fangular-adding-js-fle-getting-uncaught-syntaxerror-unexpected-string%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown