I'm trying to setup an existing vuejs project on AWS
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
background: $info;
^
Undefined variable: "$info".
in /var/www/html/tradeline-creditpartner/src/assets/scss/core/scafholding.scss (line 226, c olumn 17)
# ./src/assets/scss/app.scss 4:14-229 14:3-18:5 15:22-237
# ./src/main.js
# multi (webpack)-dev-server/client?http://IP:8081/sockjs-node (webpack)/hot/dev-serv er.js ./src/main.js
However when trying to serve the project
npm run serve It keeps showing the above error
Is there something wrong with vuejs installation?
that's the only error I keep encountering.
Related
I was trying to install jquery on my Angular project and after write some jquery dependency on package.json doc and type npm update, the console says Error: Module not found: Error: Can't resolve 'angular2-moment'.
Error occurs in the template of component RegisterComponent.
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
× Failed to compile.
✔ Browser application bundle generation complete.
Initial Chunk Files | Names | Raw Size
main.js | main | 83.62 kB |
runtime.js | runtime | 6.51 kB |
4 unchanged chunks
Build at: 2023-01-10T02:39:00.432Z - Hash: 2a1b1b37176d6913 - Time: 536ms
./src/app/app.module.ts:7:0-47 - Error: Module not found: Error: Can't resolve 'angular2-moment' in 'C:\Users\xxxxxx\Desktop\Proyectos IT\registro_cintas\client\src\app'
Error: src/app/app.component.html:6:34 - error NG8002: Can't bind to 'routerLink' since it isn't a known property of 'a'.
6 <a class="link-home" [routerLink]="['/home']">
continue...
~~~~~~~~~~~~~~~~~~~~~~~~
I tryed installing ngx-moment, angular2-moment again or uninstalling this last one algo I erase the entire folder and made a git clone from the last working commit but nothing, I think the angular2-moment it's not compatible with my Angular version but I don't know what to do.
I wrote my program with Laravel and Vuejs and it works fine on the localhost, but it gets an error on the host.
Problem:
The program runs well on local host, but when I put it on the host, the following error is appears:
[vue-router] Failed to resolve async component default:
ChunkLoadError: Loading chunk vendors~demo failed
ChunkLoadError: "Loading chunk vendors~demo failed.
(missing: http://example.com/vendors~demo.js)"
requireEnsure http://example.com/js/manifest.js:127
component webpack-internal:///./resources/js/router.js:56
resolveAsyncComponents webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1904
flatMapComponents webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1931
flatMapComponents webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1931
flatMapComponents webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1930
resolveAsyncComponents webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1866
iterator webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2121
step webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1847
step webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1851
step webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1851
step webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:1848
iterator webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2140
_callee$ webpack-internal:///./resources/js/permission.js:109
What I did:
I assumed that the files might not be properly located on the host, but that was not the problem.
The next possibility was to update Webpack, but that didn't solve the problem.
Where is the problem?
After several attempts, I used the following command to get the compiled js files, which was a mistake. These are good for development purposes.
npm run watch
or
yarn watch
Use the following command to get the output:
npm run prod
I did not change anything in app.scss, but when I run npm run watch I get the following errors:
error in ./resources/sass/app.scss
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Unsupported operation: Cannot extract a file path from a URI with a fragment component
# ./resources/sass/app.scss 2:14-254
Asset Size Chunks Chunk Names
/js/app.js 2.46 MiB /js/app [emitted] /js/app
ERROR in ./resources/sass/app.scss
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/lib/loader.js):
undefined
^
Join(null, "variables"): part 0 was null, but part 1 was not.
#import 'variables';
^^^^^^^^^^^
stdin 2:9 root stylesheet
in C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\resources\sass\app.scss (line 2, column 9)
at runLoaders (C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\webpack\lib\NormalModule.js:30
at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\LoaderRunner.js:364:11
at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\LoaderRunner.js:230:18
at context.callback (C:\Users\TAQI VAHEED\Desktop\#Coding\resPro\node_modules\loader-runner\lib\Loader
13)
Any help appreciated.
Finally found the issue. It is related to dart-sass being used instead of node-sass with laravel-mix v4.x.x.
Turns out something related to dart-sass or laravel-mix does not work well with paths containing a '#' symbol. In your case, your app is located at C:\Users\TAQI VAHEED\Desktop\#Coding\resPro and the #Coding folder is creating the error.
Either move your app somewhere else without a '#' symbol in the path OR enable node-sass again by following the steps from laravel-mix 4.0.0 release notes:
you can manually switch back to node-sass, like so:
npm install node-sass
mix.sass('resources/sass/app.sass', 'public/css', {
implementation: require('node-sass')
});
in your webpack.mix.js write the code
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css');
I'm following this tutorial for RxJS
but When I get to the part of setting up env, I get an error message when doing
$yarn run start
import * as Rx from "rxjs/Observable";
console.log(Rx);
if I leave the log without the "Rx", it shows fine.
But if I use the log... I get this error:
ERROR in ./node_modules/rxjs/Observable.js
Module not found: Error: Can't resolve 'rxjs-compat/Observable' in '/Users/manuel/Documents/testeos/JS/rxjs/node_modules/rxjs'
# ./node_modules/rxjs/Observable.js 6:9-42
# ./src/code.ts
# multi (webpack)-dev-server/client?http://localhost:8080 ./src/code.ts
I ran into the same issue today
Install yarn add rxjs-compat / npm install rxjs-compat
or
Do don't use deprecated imports: rxjs/Rx, rxjs/Observable, etc... (see new import paths)
I'm stumbling around trying to get bazel working with pypi dependencies.
./pypi.bzl:
def _impl(ctx):
ctx.actions.run_shell(
command = "pip download %s" % ctx.package
)
_pypi_package = rule(
implementation=_impl,
attrs={"package": attr.label(mandatory=True)},
)
def pypi_package(package):
_pypi_package(name = package, package = package)
./BUILD:
py_binary(
name = "app",
srcs = ["app.py"],
deps = [":python-dateutil"]
)
load("//:pypi.bzl", "pypi_package")
pypi_package(
package="python-dateutil",
)
Trying to build:
$ bazel build app
ERROR: /path/to/cwd/BUILD:9:1: in _pypi_package rule //:python-dateutil: cycle in dependency graph:
//:app
.-> //:python-dateutil [self-edge]
`--
This cycle occurred because of a configuration option.
ERROR: Analysis of target '//:app' failed; build aborted.
INFO: Elapsed time: 0.219s
No idea if this is even the right approach for working with external dependencies, but ignoring that, I don't understand where the self-dep here is coming from. In fact, I don't see that I'm declaring any deps for the pypi_package rule at all. What's going on?
The issue was attr.label: "label" here means BUILD label. I should have been using attr.string.