Trying to share Gulp project with a friend - regex

I have made a gulp project and I am trying to share it with a friend.
Its a simple css grid with gulp tasks integrated.
You can download the package here:
https://www.dropbox.com/s/od1dsh75tegbq24/projectfolder.zip?dl=1
When you unzip the package and make sure you have node.js, ruby and gulp.js installed and try to run the gulpfile, it throws the following error:
Cannot find module "semver-regex"
After I install that (npm install --save semver-regex)
It throws the same kind of error with:
Cannot find module "array-uniq"
After I install that, the build proces works, but liveReload and watch tasks don't...
Is there a way to share Gulpfiles without all the hassle? I just want it to be downloaded and used :)
Package.json is in the root:
{
"devDependencies": {
"gulp-minify-css": "^0.3.10",
"gulp-concat": "^2.4.1",
"gulp-uglify": "^1.0.1",
"gulp-imagemin": "^1.0.1",
"imagemin-pngcrush": "^1.0.0",
"gulp-sass": "^1.0.0",
"gulp-html-replace": "^1.3.0",
"gulp-connect": "^2.0.6",
"gulp-open": "^0.2.8",
"run-sequence": "^1.0.0",
"streamqueue": "^0.1.1"
}
}

Related

Custom module compiles against different NodeJS version

I have built a custom NodeJS module in C++, and I would like to use that in my electron app.
The module compilation using node-gyp works fine, and it copies the files in a dedicated directory. I can also install it by referring to the folder in my package.json file.
However, when I run the application, I get the following error:
(node:20800) UnhandledPromiseRejectionWarning: Error: The module '\?\D:\GitProjects\addon-test\local_node_modules\zeelicensenode\zeelicensenodejsaddon.node'
was compiled against a different Node.js version using
NODE_MODULE_VERSION 93. This version of Node.js requires
NODE_MODULE_VERSION 103. Please try re-compiling or re-installing
The module is compiled on the same Windows machine I am running the application and has only one NodeJS version installed.
D:\GitProjects\addon-test> node --version
v16.13.2
As per the electron documentation, it uses a different ABI than the native NodeJS binary, so they suggest to build the module in a different way. Following that documentation, I updated the make.ps1 file of C++ module as follows:
make.ps1
$env:Path="$($env:APPDATA)\npm;$($env:Path)"
npm install -g node-gyp
node-gyp clean
node-gyp configure
$env:HOME="$($env:USERPROFILE)\.electron-gyp;$($env:HOME)"
node-gyp build --target=18.1.0 --arch=x64 --dist-url=https://atom.io/download/electron
copy -Verbose .\build\Release\zeelicensenodejsaddon.node .\dist
In my electron application, I have the following dependencies:
package.json
"dependencies": {
"#quasar/extras": "^1.0.0",
"core-js": "^3.6.5",
"quasar": "^2.0.0",
"vue": "^3.0.0",
"vue-router": "^4.0.0",
"zeelicensenodejs": "file:local_node_modules/zeelicensenode"
},
"devDependencies": {
"#quasar/app": "^3.0.0",
"electron": "^18.1.0",
"electron-rebuild": "^3.2.7"
}
The local_node_modules/zeelicensenode folder contains the declaration file, package.json file, zeelicensenodejsaddon.node file and a JS file that exports the module. The JS file has these lines:
const license = require('./zeelicensenodejsaddon');
module.exports = license;
NODE_MODULE_VERSION 103 refers to the current NodeJS version (18.x), but I do not understand where it is coming from. I have NodeJS 16.x installed on my machine, and as per the Electron's release information, Electron v18.1.0 also has NodeJS 16.x.
Is there anything I am missing to make this custom module work with Electron?

How can I upgrade ember 2.7 to 3.28?

My team inherited an old (around 2017) ember.js based project, and we need to choose between remake the project with vue, or just upgrade ember version.
The project use node 6.16, and here are the dependencies :
// package.json
{
"version": "1.0.0",
"private": true,
"engines": {
"node": ">= 0.10.0"
},
"author": "",
"license": "MIT",
"devDependencies": {
"broccoli-asset-rev": "^2.2.0",
"chart.js": "2.2.1",
"ember-ajax": "0.7.1",
"ember-browserify": "1.1.13",
"ember-cli": "2.4.2",
"ember-cli-app-version": "^1.0.0",
"ember-cli-autoprefixer": "0.6.0",
"ember-cli-babel": "^5.1.5",
"ember-cli-chart": "3.1.0",
"ember-cli-chartjs": "2.3.1",
"ember-cli-dependency-checker": "^1.2.0",
"ember-cli-htmlbars": "^1.3.5",
"ember-cli-htmlbars-inline-precompile": "^0.3.1",
"ember-cli-inject-live-reload": "^1.10.2",
"ember-cli-moment-shim": "2.2.0",
"ember-cli-qunit": "^1.2.1",
"ember-cli-release": "0.2.8",
"ember-cli-sass": "5.3.0",
"ember-cli-spinjs": "1.0.8",
"ember-cli-sri": "^2.1.0",
"ember-cli-uglify": "^1.2.0",
"ember-cookies": "0.0.9",
"ember-data": "^2.18.5",
"ember-disable-proxy-controllers": "^1.0.2",
"ember-export-application-global": "^1.0.4",
"ember-load-initializers": "^0.5.0",
"ember-models-table": "1.11.0",
"ember-moment": "7.0.0-beta.3",
"ember-pikaday": "2.1.0",
"ember-power-select": "1.0.0-beta.14",
"ember-resolver": "^2.0.3",
"ember-rl-year-picker": "^0.2.0",
"liquid-fire": "0.24.0",
"loader.js": "^4.0.0",
"semantic-ui-ember": "2.0.0-beta.0"
},
"dependencies": {
"ember-colpick": "^0.6.2",
"findup": "^0.1.5",
"semantic-ui-icon": "^2.3.3"
}
}
// bower.json
{
"dependencies": {
"ember": "~2.7",
"ember-cli-shims": "0.1.0",
"ember-cli-test-loader": "0.2.2",
"ember-qunit-notifications": "0.1.0",
"hammerjs": "^2.0.6",
"matchMedia": "0.2.0",
"semantic-ui": "^2.2.4",
"chartjs": "2.1.6",
"spin.js": "^2.3.2",
"mjolnic-bootstrap-colorpicker": "^2.3.6",
"colpick": "2.0.2",
"pikaday": "^1.4.0"
},
"devDependencies": {
"js-cookie": "^2.1.2"
}
}
Yes the project use bower & npm, no idea why.
Knowing this, I got some questions :
Is this normal that ember-cli from npm has not the same version as ember from bower ?
Do you think it is even possible to upgrade ember from 2.7 (or 2.4.2??) to 3.28 (which is LTS) ?
We tried to use the famous ember update and ember-cli-update but it seems that our version (2.4.2) of ember-cli doesn't support it. We can't even find from which version this is supported.
If this is possible, then how ?
Is it possible to get rid of bower ? Before upgrading or after ?
The project is quite large, so we would like to avoid remaking it with vuejs.
And to answer the "why upgrading ember ?", well, node 6 is awful. We need at least node 12
every version is upgradable! But the safest way to do so is probably to traverse from LTS to LTS.
So, 2.4 -> 2.8 -> 2.12 -> 2.16 -> 2.18 -> 3.4 -> 3.8 -> 3.12 -> 3.16 > 3.20 -> 3.24 -> 3.28
More information about Releases here
That may sound like a lot of work, but it's why it's so important to keep up with upgrades. (It may not actually be that much work, depending on the size of your app, and how much you get distracted by new features)
The general strategy at each step is:
have a good test suite
loop:
ensure you have 0 deprecations being logged while running tests
upgrade all libraries to the highest they can go while supporting your version of ember (this'll require some spelunking, but thankfully, you don't have very many non-default deps)
upgrade your ember-source version to the next LTS
Getting off bower is a little non-standard though (in that it's a one-time thing), but there are some blog posts to help you out:
The 2x release blog posts: https://blog.emberjs.com/tag/version-2-x
The 3x release blog posts: https://blog.emberjs.com/tag/version-3-x
From reading the 2-x blog posts, I found this migration guide for getting off bower: https://github.com/ember-cli/ember-cli/releases/tag/v2.13.0-beta.1
I'd probably try to do this first, because you can do the nice upgrade loop described above
However, since you're thinking about re-writing in Vue, it may make sense to just re-write in Ember 4.2 instead -- since a lot of the concepts transfer (if you're not familiar with the latest ember, I cannot recommend the tutorial enough, as it's hard to top.
For a full list of features there is this app: https://upgrade.emberjs.com/changes?fromVersion=2.4&toVersion=4.2
(It says to run some commands, I wouldn't do either of those commands being as far back as 2.4)
For better support through you're upgrade, I recommend joining ember's discord server: https://discord.gg/emberjs

ember-cli-eslint, ember-cli-stylelint to run automatically only if desired

I understand that the purpose of ember-cli-eslint, ember-cli-stylelint to run automatically.
I am wondering if there is a way to control this behavior.
Like, run ember-cli-eslint, ember-cli-stylelint automatically only if there is certain ENVIRONMENT_VARIABLE or maybe write a custom script.
I am wondering if that is possible. Google search did not provide me any pointer.
Yes.
For ESLint:
Remove the addon ember-cli-eslint
Install the npm package eslint in your project
ESLint will then run only when you actually run ./node_modules/.bin/eslint .
You should update your package.json's lint:js script as well.
For Stylelint:
Remove the addon ember-cli-stylelint
Install the npm package stylelint in your project
Stylelint will then run only when you actually run ./node_modules/.bin/stylelint
You should update your package.json's lint:css script as well.
As suggested by #Turbo87 at https://github.com/ember-cli/ember-cli-eslint/issues/333 I have updated ember-cli-build.js like so:
const blacklist = [];
if (process.env.DISABLE_AUTO_LINT) {
blacklist.push('ember-cli-eslint', 'ember-cli-eslint');
}
let app = new EmberApp(defaults, {
addons: { blacklist },
});
And it works as desired.
A simplified package.json/script looks something like so:
"scripts": {
"eslint": "eslint .",
"stylelint": "stylelint app/styles",
"lint": "npm run eslint && npm run stylelint",
"start": "DISABLE_AUTO_LINT=true ember serve",
"test": "npm run lint --silent && DISABLE_AUTO_LINT=true ember exam --split=10 --parallel",
}
ember serve functions as business as usual.

Can prettier plugin get integrated into the web IDE when saving js files?

I would like to configure Prettier within the WebIDE, so far without success.
In my package.json file, I have the following settings:
"scripts": {
"format": "prettier --write \"webapp/**/*.{js,css,json}\""
},
"devDependencies": {
"prettier": "^1.14.3",
"eslint": "^5.7.0",
"eslint-plugin-prettier": "^3.0.0",
"eslint-config-prettier": "^3.1.0" //Here I get ESLint error cannot find module
}
Then, in my .eslintrc.json file:
"extends": ["eslint:recommended", "prettier"]
This is not really working, my goal is to format according to Prettier when I save a file (similar to the "beautify code" option in the web IDE code editor settings, which is now switched off).
I tried cleaning the npm folder and building again, but nothing happens.

Ember-CLI uses wrong path for jQuery and QUnit

I'm using a fresh install of ember-cli with the following versions:
~/Projects/ember_tut > ember s
version: 1.13.13
node: 4.2.1
npm: 2.14.10
os: darwin x64
bower.json looks like this:
{
"name": "ember-tut",
"dependencies": {
"ember": "1.13.11",
"ember-cli-shims": "0.0.6",
"ember-cli-test-loader": "0.2.1",
"ember-data": "1.13.15",
"ember-load-initializers": "0.1.7",
"ember-qunit": "0.4.16",
"ember-qunit-notifications": "0.1.0",
"ember-resolver": "~0.1.20",
"jquery": "^1.11.3",
"loader.js": "ember-cli/loader.js#3.4.0",
"qunit": "~1.20.0",
"pretender": "~0.10.1",
"lodash": "~3.7.0",
"Faker": "~3.0.0"
}
}
Immediately after running ember new ember_test:
~/Projects/ember_tut > ember s
version: 1.13.13
Livereload server on http://localhost:49154
Serving on http://localhost:4200/
ENOENT: no such file or directory, stat '/Users/sms/Projects/ember_tut/tmp/concat_with_maps-input_base_path-pmZyxQ2F.tmp/0/bower_components/jquery/dist/jquery.js'
Error: ENOENT: no such file or directory, stat '/Users/sms/Projects/ember_tut/tmp/concat_with_maps-input_base_path-pmZyxQ2F.tmp/0/bower_components/jquery/dist/jquery.js'
at Error (native)
at Object.fs.statSync (fs.js:849:18)
at ConcatWithMaps.keyForFile (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/broccoli-sourcemap-concat/node_modules/broccoli-caching-writer/index.js:90:20)
at Array.map (native)
at ConcatWithMaps.CachingWriter._conditionalBuild (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/broccoli-sourcemap-concat/node_modules/broccoli-caching-writer/index.js:112:65)
at /Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/broccoli-sourcemap-concat/node_modules/broccoli-caching-writer/node_modules/broccoli-plugin/read_compat.js:61:34
at lib$rsvp$$internal$$tryCatch (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:493:16)
at lib$rsvp$$internal$$invokeCallback (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:505:17)
at lib$rsvp$$internal$$publish (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:476:11)
at lib$rsvp$asap$$flush (/Users/sms/Projects/ember_tut/node_modules/ember-cli/node_modules/rsvp/dist/rsvp.js:1198:9)
It's looking for jquery.js in bower_components/jquery/dist/jquery.js but it's really in bower_components/jquery/jquery-1.11.3/dist/jquery.js.
This is easily "fixed" by creating a symlink in bower_components/jquery/ to bower_components/jquery/jquery-1.11.3/dist, but that's awfully klunky, and I'm wondering what the right way to address it is.
I found that removing all npm and bower caches, then reinstalling everything worked, which makes me think that nem's suggestion in the comments was pretty close:
npm cache clear && bower cache clean && rm -rf node_modules bower_components && npm install && bower install