Shopify
Unable to start example in Windows 10
Please use this template to help contributors get a detailed description of the issue or feature.
For support questions, please use stackoverflow. This repository's issues are reserved for feature requests and bug reports.
1. Apply either the bug or feature-request label
bug
2. Describe the bug or feature
I tried running the example, I tried running yarn install and yarn start in both root folder and examples.
Here's result of running yarn; yarn start; in root:
PS C:\Users\<User>\Documents\Projects\oss\draggable> yarn; yarn start;
yarn install v1.22.17
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning "babel-preset-shopify > react-hot-loader > [email protected]" has unmet peer dependency "react@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0".
warning "babel-preset-shopify > react-hot-loader > [email protected]" has unmet peer dependency "react-dom@^0.14.0 || ^15.0.0 || ^16.0.0-beta || ^16.0.0".
warning "eslint-plugin-shopify > [email protected]" has unmet peer dependency "typescript@*".
[4/4] Building fresh packages...
$ yarn build:development
yarn run v1.22.17
$ node scripts/build.js
Hash: d7f95c13f49128796bbb
Version: webpack 4.12.0
Time: 1657ms
Built at: 07/20/2022 3:40:07 PM
Asset Size Chunks Chunk Names
index.js 246 KiB main [emitted] main
Entrypoint main = index.js
[./src/Draggable/DragEvent/index.js] 359 bytes {main} [built]
[./src/Draggable/Draggable.js] 20.2 KiB {main} [built]
[./src/Draggable/DraggableEvent/index.js] 379 bytes {main} [built]
[./src/Draggable/Plugins/index.js] 1.36 KiB {main} [built]
[./src/Draggable/Sensors/DragSensor/index.js] 318 bytes {main} [built]
[./src/Draggable/Sensors/ForceTouchSensor/index.js] 348 bytes {main} [built]
[./src/Draggable/Sensors/index.js] 1.43 KiB {main} [built]
[./src/Draggable/index.js] 1.4 KiB {main} [built]
[./src/Droppable/index.js] 613 bytes {main} [built]
[./src/Plugins/index.js] 1.61 KiB {main} [built]
[./src/Sortable/index.js] 604 bytes {main} [built]
[./src/Swappable/index.js] 613 bytes {main} [built]
[./src/index.js] 1.91 KiB {main} [built]
[./src/shared/AbstractEvent/index.js] 333 bytes {main} [built]
[./src/shared/AbstractPlugin/index.js] 338 bytes {main} [built]
+ 58 hidden modules
Done in 5.00s.
Done in 14.49s.
yarn run v1.22.17
$ concurrently "yarn watch" "cd examples && yarn && yarn start"
$ node scripts/watch.js
[1/4] Resolving packages...
success Already up-to-date.
$ yarn run build
$ yarn run clean && gulp build $npm_package_config_tools
$ rimraf dist bundle-report.html
[0] Hash: d7f95c13f49128796bbb
[0] Version: webpack 4.12.0
[0] Time: 1782ms
[0] Built at: 07/20/2022 3:40:12 PM
[0] Asset Size Chunks Chunk Names
[0] index.js 246 KiB main [emitted] main
[0] Entrypoint main = index.js
[0] [./src/Draggable/DragEvent/index.js] 359 bytes {main} [built]
[0] [./src/Draggable/Draggable.js] 20.2 KiB {main} [built]
[0] [./src/Draggable/DraggableEvent/index.js] 379 bytes {main} [built]
[0] [./src/Draggable/Plugins/index.js] 1.36 KiB {main} [built]
[0] [./src/Draggable/Sensors/DragSensor/index.js] 318 bytes {main} [built]
[0] [./src/Draggable/Sensors/ForceTouchSensor/index.js] 348 bytes {main} [built]
[0] [./src/Draggable/Sensors/index.js] 1.43 KiB {main} [built]
[0] [./src/Draggable/index.js] 1.4 KiB {main} [built]
[0] [./src/Droppable/index.js] 613 bytes {main} [built]
[0] [./src/Plugins/index.js] 1.61 KiB {main} [built]
[0] [./src/Sortable/index.js] 604 bytes {main} [built]
[0] [./src/Swappable/index.js] 613 bytes {main} [built]
[0] [./src/index.js] 1.91 KiB {main} [built]
[0] [./src/shared/AbstractEvent/index.js] 333 bytes {main} [built]
[0] [./src/shared/AbstractPlugin/index.js] 338 bytes {main} [built]
[0] + 58 hidden modules
[1] [15:40:15] No gulpfile found
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
error Command failed with exit code 1.
[1] cd examples && yarn && yarn start exited with code 1
3. If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem
- Clone the repository
- Run
yarn; yarn start;in Windows
4. Please tell us about your environment:
System:
OS: Windows 10 10.0.22000
CPU: (12) x64 11th Gen Intel(R) Core(TM) i7-11600H @ 2.90GHz
Binaries:
Node: 16.13.2 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.17 - C:\Program Files\nodejs\yarn.CMD
npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
Languages:
Python: 3.9.10 - /c/Users/Jip Irfandy/AppData/Local/Programs/Python/Python39/python
Browsers:
Edge: Spartan (44.22000.120.0), Chromium (101.0.1210.39)
npmGlobalPackages:
gatsby-cli: 4.16.0
Try using the same node version as in .nvmrc (v10.4.0) or in examples/.nvmrc (12.16.0)
Hi @hnrq, thanks for replying!
I already did that. I do install node via nvm and am aware of the use of .nvmrc but I can't seem to do it.
Do you have any other solution? Or do you need any other info from me about my spec?
Got it, that's odd... I remember I had a similar error, but it worked once I used the right version, no other solutions from my side :/
Haha thanks thought, but I do notice that there's this line
[1] [15:40:15] No gulpfile found
I'm pretty sure it is what it meant. Maybe there's supposed to be a gulpfile somewhere? It's weird that it seems that I'm the only one issueing this. I checked in StackOverflow, that this error literally mean what it is.
https://stackoverflow.com/questions/38937095/no-gulpfile-found
Here's a list of my package.json @hnrq
{
"name": "@shopify/draggable",
"version": "1.0.0-beta.13",
"private": false,
"license": "MIT",
"description": "The JavaScript Drag & Drop library your grandparents warned you about.",
"author": "Shopify <[email protected]>",
"homepage": "https://github.com/Shopify/draggable#readme",
"repository": "https://github.com/Shopify/draggable",
"contributors": [
{
"name": "Max Hoffmann",
"email": "[email protected]"
},
{
"name": "Curtis Dulmage",
"email": "[email protected]"
}
],
"bugs": {
"url": "https://github.com/Shopify/draggable/issues"
},
"keywords": [
"shopify",
"draggable",
"drag-and-drop",
"es6"
],
"main": "./lib/draggable.bundle.js",
"types": "./index.d.ts",
"scripts": {
"start": "concurrently \"yarn watch\" \"cd examples && yarn && yarn start\"",
"build": "yarn build:production",
"watch": "node scripts/watch.js",
"prepare": "yarn build:development",
"prepublishOnly": "yarn build:production",
"lint": "eslint ./src ./scripts --max-warnings 0",
"esdoc": "esdoc -c esdoc.json",
"test": "jest --config config.json",
"test-ci": "jest --config config.json --coverage && codecov",
"build:development": "node scripts/build.js",
"build:production": "node scripts/build.js --production"
},
"files": [
"lib/**/*.js",
"index.d.ts"
],
"devDependencies": {
"babel-core": "^6.26.3",
"babel-jest": "^23.0.1",
"babel-loader": "^7.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-es2015-classes": "^6.24.1",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-shopify": "^16.5.0",
"codecov": "^3.0.2",
"concurrently": "^3.5.1",
"core-js": "^2.5.7",
"esdoc": "^1.1.0",
"esdoc-ecmascript-proposal-plugin": "^1.0.0",
"esdoc-standard-plugin": "^1.0.0",
"eslint": "^4.19.1",
"eslint-loader": "^2.0.0",
"eslint-plugin-shopify": "^22.1.0",
"jest": "^23.1.0",
"webpack": "^4.12.0",
"webpack-bundle-analyzer": "^2.13.1",
"webpack-cli": "^3.0.3"
},
"eslintConfig": {
"extends": "plugin:shopify/esnext",
"env": {}
},
"babel": {
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-es2015-modules-commonjs"
]
},
"publishConfig": {
"access": "public",
"@shopify:registry": "https://registry.npmjs.org"
}
}
Oh it seems that it's the same issue as this one #225. That leads me to #259. I tried testing the my current repo, but failed at step 5 of #259.
Ah, I looked again. So it's Window's problem after all.. I tried changing the script, instead of using the $npm_package_config_tools, I replaced them with the real value and it worked!
"scripts": {
"clean": "rimraf dist bundle-report.html",
"views": "gulp views --require @babel/register --gulpfile tools",
"scripts": "gulp scripts --require @babel/register --gulpfile tools",
"styles": "gulp styles --require @babel/register --gulpfile tools",
"start": "gulp start --require @babel/register --gulpfile tools",
"build": "yarn run clean && gulp build --require @babel/register --gulpfile tools",
"build:prod": "NODE_ENV=production yarn run build",
"lint:scss": "stylelint './src/**/*.scss'",
"prettier:scss": "prettier-stylelint './src/**/*.scss' --write -q",
"lint:js": "eslint './src/**/*.js' './tools/**/*.js' --max-warnings 0",
"prettier:js": "yarn run lint:js --fix",
"prepublish": "yarn run build"
},