Topic: Problems with Gitlab CI/CD
Expected behavior
In Gitlab pipeline my project would be build like on local machine.
Actual behavior
I got errors. I found that node_modules/mdbvue folder does not contains required folders after npm install completed.
Resources (screenshots, code snippets etc.)
.gitlab-ci.yml:
stages:
- build-frontend
image: lnkra/<...project name...>:latest
before_script:
- mkdir -p ~/.ssh
- echo "$SSH_PRIVATE_KEY" >> ~/.ssh/id_rsa
- chmod 600 ~/.ssh/id_rsa
- echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config
build frontend:
stage: build-frontend
only:
- master
- draft
script:
- cd frontend
- npm install
- ls -la node_modules/mdbvue
- npm run build
artifacts:
paths:
- dist
package.json:
{
"name": "<...project name...>",
"version": "0.3.1",
"description": "",
"author": "Aleksandr Bogdanov <...my email...@yahoo.com>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"lint": "eslint --ext .js,.vue src",
"build": "node build/build.js"
},
"dependencies": {
"ajv": "^6.10.2",
"ajv-keywords": "^3.4.0",
"axios": "^0.18.1",
"mdbvue": "git+https://oauth2:<...license token...>.mdbootstrap.com/mdb/vue/vu-pro.git",
"node-sass": "^4.11.0",
"sass-loader": "^7.3.1",
"vue": "^2.5.2",
"vue-router": "^3.1.3",
"vuex": "^3.1.0"
},
"devDependencies": {
...
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
Gitlab CI/CD pipeline output:
Running with gitlab-runner 12.3.0 (a8a019e0)
on docker-auto-scale 72989761
Using Docker executor with image lnkra/<...project name...>:latest ...
Pulling docker image lnkra/<...project name...>:latest ...
Using docker image sha256:dd41b9422753f6aa01c5b270be56eadb4997ea7f99f1c8ab2863ca413b012ab6 for lnkra/<...project name...>:latest ...
Running on runner-72989761-project-14997921-concurrent-0 via runner-72989761-srm-1572347808-7a3bcb3d...
Fetching changes with git depth set to 50...
Initialized empty Git repository in /builds/lnkr.a/<...project name...>/.git/
Created fresh repository.
From https://gitlab.com/lnkr.a/<...project name...>
* [new ref] refs/pipelines/92250242 -> refs/pipelines/92250242
* [new branch] master -> origin/master
Checking out b1785323 as master...
Skipping Git submodules setup
$ mkdir -p ~/.ssh
$ echo "$SSH_PRIVATE_KEY" >> ~/.ssh/id_rsa
$ chmod 600 ~/.ssh/id_rsa
$ echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config
$ cd frontend
$ npm install
> node-sass@4.13.0 install /builds/lnkr.a/<...project name...>/frontend/node_modules/node-sass
> node scripts/install.js
Downloading binary from https://github.com/sass/node-sass/releases/download/v4.13.0/linux-x64-72_binding.node
Download complete
Binary saved to /builds/lnkr.a/<...project name...>/frontend/node_modules/node-sass/vendor/linux-x64-72/binding.node
Caching binary to /root/.npm/node-sass/4.13.0/linux-x64-72_binding.node
> core-js@2.6.7 postinstall /builds/lnkr.a/<...project name...>/frontend/node_modules/core-js
> node scripts/postinstall
> uglifyjs-webpack-plugin@0.4.6 postinstall /builds/lnkr.a/<...project name...>/frontend/node_modules/webpack/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js
> node-sass@4.13.0 postinstall /builds/lnkr.a/<...project name...>/frontend/node_modules/node-sass
> node scripts/build.js
Binary found at /builds/lnkr.a/<...project name...>/frontend/node_modules/node-sass/vendor/linux-x64-72/binding.node
Testing binary
Binary is fine
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
added 1455 packages from 780 contributors and audited 13434 packages in 40.023s
found 10 vulnerabilities (6 moderate, 4 high)
run `npm audit fix` to fix them, or `npm audit` for details
$ ls -la node_modules/mdbvue
total 260
drwxr-xr-x 4 root root 4096 Oct 29 11:19 .
drwxr-xr-x 916 root root 36864 Oct 29 11:19 ..
drwxr-xr-x 6 root root 4096 Oct 29 11:19 lib
-rw-r--r-- 1 root root 171169 Oct 26 1985 License.pdf
drwxr-xr-x 5 root root 4096 Oct 29 11:19 node_modules
-rw-r--r-- 1 root root 2260 Oct 29 11:19 package.json
-rw-r--r-- 1 root root 9679 Oct 26 1985 README.md
$ npm run build
> <...project name...>@0.3.0 build /builds/lnkr.a/<...project name...>/frontend
> node build/build.js
Hash: af8114981e23cfc3fb8b
Version: webpack 3.12.0
Time: 44324ms
Asset Size Chunks Chunk Names
static/js/vendor.e67cd88c7c01838fd594.js 994 kB 0 [emitted] [big] vendor
static/js/app.f463cbbaba6bbab57b82.js 115 kB 1 [emitted] app
static/js/manifest.2ae2e69a05c33dfc65f8.js 857 bytes 2 [emitted] manifest
static/css/app.bdb6f651578f675e724dc3200c004920.css 180 kB 1 [emitted] app
static/css/app.bdb6f651578f675e724dc3200c004920.css.map 251 kB [emitted]
static/js/vendor.e67cd88c7c01838fd594.js.map 2.66 MB 0 [emitted] vendor
static/js/app.f463cbbaba6bbab57b82.js.map 439 kB 1 [emitted] app
static/js/manifest.2ae2e69a05c33dfc65f8.js.map 4.97 kB 2 [emitted] manifest
index.html 587 bytes [emitted]
static/<...project name...>-logo-square.png 8.13 kB [emitted]
static/<...project name...>-logo-square.svg 4.29 kB [emitted]
static/<...project name...>-logo.svg 5.46 kB [emitted]
ERROR in ./src/main.js
Module not found: Error: Can't resolve 'mdbvue/build/css/mdb.css' in '/builds/lnkr.a/<...project name...>/frontend/src'
@ ./src/main.js 4:0-34
ERROR in ./src/main.js
Module not found: Error: Can't resolve 'mdbvue/src/components/pro/Advanced/Notify' in '/builds/lnkr.a/<...project name...>/frontend/src'
@ ./src/main.js 9:0-63
Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! <...project name...>@0.3.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the <...project name...>@0.3.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2019-10-29T11_19_57_940Z-debug.log
ERROR: Job failed: exit code 1
Please help me!
Mikołaj Smoleński staff answered 5 years ago
There was a syntax change in the latest major update. Please check the following page: https://mdbootstrap.com/docs/vue/getting-started/quick-start/#existing-project
Now, you should use new import statements in main.js: import 'mdbvue/lib/css/mdb.min.css'
Also Notify is not in src dir, but should be imported like this: import Notify from 'mdbvue/lib/components/Notify'
Best regards
laniakea answered 5 years ago
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.0.0
- Device: Gitlab CI/CD docker container
- Browser: n/a
- OS: Arch linux in docker container
- Provided sample code: No
- Provided link: No