Да, название кажется странным, но я не знаю, как правильно подойти к этому вопросу.
Я боролся с проблемой уже несколько дней. Недавно мы внедрили gitlab в нашу рабочую среду и создали несколько файлов CI в каждом разрабатываемом проекте. Но в настоящее время я сталкиваюсь с неприятной проблемой, пытаясь построить ее, то есть импортированные зависимости пряжи не одинаковы для разных проектов.
Был этап тестирования, когда все работало, но потом, когда мыпосле тестирования я создал новый проект, больше ничего не работало, что меня немного озадачило.
К актуальной проблеме: у меня есть 5-угловой проект, который я пытаюсь встроить в gitlab, этот проектиспользует веб-пакет. Это используемые файлы (сокращены до строгого рабочего минимума и отредактированы для конфиденциальности, пути могут быть непоследовательными):
gitlab-ci.yaml:
default:
image: node:8
.angular-cache: &angular-cache
cache:
key: yarnCache
paths:
- "yarn.lock"
- "node_modules"
.angular-artifacts: &angular-artifacts
artifacts:
paths:
- "coverage"
- "dist"
stages:
- prepare
- tests
- build
install_yarn_packages:
stage: prepare
extends: .only-mergeRequests
script:
- yarn install
artifacts:
paths:
- yarn.lock
tests:
stage: tests
needs: ["install_yarn_packages"]
image: trion/ng-cli-karma:8.3.2
<<: *angular-cache
script:
- yarn test --no-fail-on-empty-test-suite
coverage: '/^Statements\s*:\s*([^%]+)/'
<<: *angular-artifacts
build_code:
stage: build
needs: ["install_yarn_packages"]
<<: *angular-cache
script:
- yarn build
<<: *angular-artifacts
package.json:
{
"name": "my-client",
"version": "0.5.0",
"description": "My client",
"scripts": {
"start": "webpack-dev-server --config webpack.dev.js --env.baseUrl=/",
"build": "webpack -p --config webpack.prod.js",
"build-verbose": "webpack --config webpack.prod.js --display-error-details",
"test": "karma start",
"test-watch": "karma start --auto-watch --no-single-run"
},
"author": "Me",
"license": "UNLICENSED",
"private": true,
"dependencies": {
"@angular/animations": "^5.0.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",
"angular-oauth2-oidc": "^3.0.3",
"angular-sortablejs": "^2.1.0",
"angular-tree-component": "^7.0.1",
"bulma": "^0.6.0",
"bulma-checkradio": "^0.1.0",
"bulma-slider": "^0.0.2",
"bulma-switch": "^0.1.4",
"bulma-tooltip": "^0.0.4",
"css-element-queries": "^1.0.1",
"flatpickr": "^4.1.2",
"font-awesome": "^4.7.0",
"geodesy": "^1.1.2",
"moment": "^2.19.1",
"ng-dynamic-component": "^2.0.3",
"ol": "^4.4.2",
"proj4": "^2.4.4",
"rxjs": "^5.5.2",
"sortablejs": "^1.7.0",
"vis": "=4.20.1"
},
"devDependencies": {
"@angular/compiler-cli": "^5.0.0",
"@ngtools/webpack": "^1.8.0",
"@types/geojson": "^1.0.6",
"@types/jasmine": "^2.8.6",
"@types/node": "^8.0.47",
"angular2-template-loader": "^0.6.2",
"awesome-typescript-loader": "^3.3.0",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-transform-es3-member-expression-literals": "^6.22.0",
"babel-plugin-transform-es3-property-literals": "^6.22.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"browser-sync": "^2.23.6",
"browser-sync-webpack-plugin": "^2.2.2",
"clean-webpack-plugin": "^0.1.17",
"copy-webpack-plugin": "^4.2.0",
"core-js": "^2.5.1",
"css-loader": "^1.0.0",
"extract-text-webpack-plugin": "^3.0.2",
"faker": "^4.1.0",
"file-loader": "^1.1.5",
"html-loader": "^0.5.1",
"html-webpack-plugin": "^2.30.1",
"jasmine-core": "^3.1.0",
"json-server": "^0.12.1",
"karma": "^2.0.0",
"karma-chrome-launcher": "^2.2.0",
"karma-jasmine": "^1.1.1",
"karma-mocha-reporter": "^2.2.5",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^3.0.0",
"node-sass": "^4.5.3",
"null-loader": "^0.1.1",
"postcss": "^6.0.13",
"postcss-cssnext": "^3.0.2",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.1.2",
"raw-loader": "^0.5.1",
"sass-loader": "^6.0.6",
"to-string-loader": "^1.1.5",
"tslint": "^5.8.0",
"typescript": "^2.6.1",
"webpack": "^3.8.1",
"webpack-bundle-analyzer": "^2.11.2",
"webpack-dev-server": "^2.9.3",
"webpack-merge": "^4.1.1",
"zone.js": "^0.8.18"
}
}
Шаг Подготовить дает мне несколько предупреждений, но проходит:
warning " > ng-dynamic-component@2.3.0" has unmet peer dependency "tslib@^1.0.0".
warning " > @angular/compiler-cli@5.2.11" has incorrect peer dependency "typescript@>=2.4.2 <2.7".
warning "@angular/compiler-cli > tsickle@0.27.5" has incorrect peer dependency "typescript@>=2.4.2 <2.8".
warning " > css-loader@1.0.0" has incorrect peer dependency "webpack@^4.0.0".
warning " > postcss-cssnext@3.1.0" has unmet peer dependency "caniuse-lite@^1.0.30000697".
Тесты проходят успешно, но сборка завершается неудачно с:
yarn run v1.15.2
$ webpack -p --config webpack.prod.js
clean-webpack-plugin: /builds/project/client/client-ui/dist has been removed.
Hash: dbc31d0cb5b4e195042e
Version: webpack 3.12.0
Time: 6785ms
Asset Size Chunks Chunk Names
assets/data/help/img/ico_link_wht.gif 96 bytes [emitted]
assets/images/logo-blue.af0c2f43254d2fc9baf96e49036f7512.png 41.5 kB [emitted]
polyfills.dbc31d0cb5b4e195042e.bundle.js 888 bytes 0 [emitted] polyfills
app.dbc31d0cb5b4e195042e.bundle.js 101 bytes 1 [emitted] app
polyfills.dbc31d0cb5b4e195042e.bundle.js.map 9.66 kB 0 [emitted] polyfills
app.dbc31d0cb5b4e195042e.bundle.js.map 414 bytes 1 [emitted] app
favicon.png 1.3 kB [emitted]
index.html 580 bytes [emitted]
assets/data/config.json 2.67 kB [emitted]
assets/data/defaultView.json 624 bytes [emitted]
assets/data/geographic_projection.png 9.32 kB [emitted]
assets/data/help/fonts/nettoot-bold-webfont.woff 25.4 kB [emitted]
assets/data/help/fonts/nettoot-webfont.woff 25.4 kB [emitted]
assets/data/help/img/ico_link_blu.gif 96 bytes [emitted]
assets/images/compass.33339be3f1a8e2433cf0eb5586b27298.png 1.46 kB [emitted]
assets/data/help/page/help.html 7.2 kB [emitted]
assets/data/help/page/layout.css 29 kB [emitted]
assets/data/help/page/reset.css 1.01 kB [emitted]
assets/data/help/page/text.css 3.69 kB [emitted]
assets/data/help/page/client.css 890 bytes [emitted]
assets/data/avhrr.jpg 87.7 kB [emitted]
assets/data/no-image.png 1.17 kB [emitted]
assets/data/natural_earth.png 59.5 kB [emitted]
assets/data/north_polar.png 44.2 kB [emitted]
assets/data/productCategories.json 3.63 kB [emitted]
assets/data/productDecorations.json 5.13 kB [emitted]
assets/data/session_refresh.html 137 bytes [emitted]
assets/data/spherical_mercator.png 8.39 kB [emitted]
assets/data/sst.png 436 kB [emitted] [big]
[0] ./src/polyfills.ts 0 bytes {0} [built]
[1] ./src/main.ts 0 bytes {1} [built]
ERROR in Module build failed:
@import "~bulma-checkradio/checkradio.sass";
^
File to import not found or unreadable: ~bulma-checkradio/checkradio.sass.
in /builds/project/client/client-ui/css/main.sass (line 33, column 1)
Child html-webpack-plugin for "index.html":
1 asset
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs 811 bytes {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] (webpack)/buildin/module.js 517 bytes {0} [built]
+ 1 hidden module
Webpack Bundle Analyzer saved report to /builds/project/client/client-ui/bundle-report.html
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 2.
Я пытался запустить его в другом проекте, с той же конфигурацией и тем же файлом gitlab-ci, и он отлично работает. Также отлично работает при запуске в Docker с файлом:
FROM node:8
COPY . /app
WORKDIR /app
RUN yarn install
RUN yarn build
Единственное отличие, которое я вижу, это версия веб-пакета, используемая при запуске yarn build: - Version: webpack 3.8.1 с файлом docker и в рабочем проекте. - Version: webpack 3.12.0 с неудачным проектом.
Я не могу понять, проблема ли это: проблема в конфигурации? Почему версия webpack отличается? Проблема в веб-пакете или чем-то еще?
Пожалуйста, помогите мне stackoverflow, вы моя последняя надежда ... Спасибо.