I am trying to set up PhpStorm to work with Babel instead of UglifyJS. I need the minifed output file to be written with a different extension to the same directory where the source script is located.
I changed argument line in the File Watchers settings for Babel to the following: $FilePathRelativeToProjectRoot$ --out-dir dist --out-file-extension .min.js --source-maps --presets minify
This is works, but output file is saved to /dist directory (without specifying --out-dir dist everything stops working) and --out-file-extension option is completely ignored. I suspect this is due to the old version of Babel 6.2, which I can't manage to update.
This "Output paths to refresh" field changes also don't work: $FileNameWithoutExtension$.min.js
Please explain how to change the arguments to solve this problem.
For me this solution works, which saves the output files .min.js at the same location, as the original file:
Install Babel global sudo npm install --save-dev -g #babel/core
Install Babel Minify global sudo npm install babel-preset-minify --save-dev -g
Setup PhpStorm Watcher with the following parameters:
Programm:
/usr/local/lib/node_modules/#babel/cli/bin/babel.js
Arguments:
$FilePathRelativeToProjectRoot$ --out-file $FileDir$/$FileNameWithoutExtension$.min.js --presets /usr/local/lib/node_modules/babel-preset-minify
PhpStorm Watcher Setup
Related
When I start typing in my new Node project, for instance, "fs" in a .js file, I get the "fs" modules as a suggestion:
But when I try to type it in a .ts file, I get nothing:
Is there a way to get the suggestion also when I type a .ts file?
thanks!
I have tried to:
Reinstall VSCode
Reset its settings
Reinstall the TypeScript extension
Downgrade to a lower version of typescript
Install ts-node
I found a solution:
Just install the #types/node package using npm or yarn to your project:
yarn add --dev #types/node
I am developping a VSCode extension that I want to try it out in the current VSCode instance, not in a new instance.
Is there a way to install the vscode extension that is developping locally from an unpacked directory, not from a .vsix file.
In Atom editor, I can use atom link to do that. Is there something similar in VSCode?
You can install the extension locally with code --install-extension and install a locally packaged extension. I am doing this with esbuild and yarn:
package.json
"scripts": {
"vscode:prepublish": "yarn run build:base --minify",
"build:base": "esbuild ./src/extension.ts --bundle --outfile=out/extension.js --external:vscode --format=cjs --platform=node",
"build": "yarn build:base --sourcemap",
"package": "mkdirp dist && vsce package -o dist/noteberry.vsix --yarn",
"deploy:local": "yarn package && code --install-extension dist/ext.vsix --force"
...
},
mkdirp is an npm module to create folders.
Original Post
One easy solution without packaging as described in https://vscode-docs.readthedocs.io/en/stable/extensions/install-extension/ would be:
VS Code looks for extensions under your extensions folder
.vscode/extensions. Depending on your platform it is located:
Windows %USERPROFILE%\.vscode\extensions
Mac $HOME/.vscode/extensions
Linux $HOME/.vscode/extensions
If you want to load your extension or customization each time VS Code
runs, copy your project to a new folder under .vscode/extensions.
You could write a script to delete / copy over all files.
I use windows 10 OS . I already try :
npm i -g tslint
also local install.
I use visual code terminal (power shell , git bash and cmd ) no help in any variant.
Where is the execution file for tslint ? I will put path intro the PATH env var.
It is probably caused by the version conflict between global and project's TsLint. You can see your version by: tslint -v
Then you can reinstall Tslint globally to latest version by:
npm install tslint typescript -g
Then use following command in your project directory to even up versions.
npm install tslint typescript --save-dev
And also you can search in your json files if there is a specification about Tslint version.
I used to install plugins in my ionic 1 project with bower. The new trend, especially with ionic 2, is to install packages with npm. Some core packages, such as ionic.cloud are not provided at all anymore with bower, even for ionic 1.x.
So I need to migrate some packages to npm. What is the recommended way to do so ?
My problem:
"npm install" seems to install packages in the "my_project/node_modules" folder, unlike bower which installs packages directly in my_project/www/lib/
As explained for instance in the installation guide of ionic.cloud this requires an additional step to copy the newly installed npm package in the lib folder with the command:
cp node_modules/#ionic/cloud/dist/bundle/ionic.cloud.min.js www/lib
However, when I update the package and run "npm update", this will update the node_modules folder, but not the lib folder. This is a problem as only the files from my lib folder are included in my index.html.
Running the cp-command after each npm update does not seem such an elegant solution. What is the recommended way to deal with this?
I think you can reverse this make the .bowerrc file create your packages inside the node_modules folder and use this path as default. Otherwise the node_modules is mandatory there is no way around creating it.
Even you can npm i --prefix ./bower_components/ <package> you still need to cp to folders up from bower_components folder
I am using the default ionic seed application, I have ran the setup
command ionic setup sass.
I run ionic serve, this should be watching for sass changes but it's not.
I tried to run gulp watch but I am getting an error.Error: Cannot find module 'semver'
Try using sudo ionic setup sass
You might not have had sufficient security privileges, thus not allowing sass to be setup properly. Using sudo will allow the user to act as a superuser and let sass setup correctly.
This worked for me.
First you need to run this command ionic setup sass when you run this command create a scss folder in www folder in scss folder here is style.scss file.
and #import this file in scss/ionic.app.scss path.
#import "www/scss/style.scss" in scss/ionic.app.scss path.
Try this I hope this is work for you.
Please delete the 'node_modules' folder in the project directory and re-run
'npm install'. This worked for me .
Make sure you have changed your index.html to include the relevant css files, as the one previously will no longer be used if you want to use the .min.css one generated by sass.
If removing the node_modules and running npm install doesn't work you can try installing gulp then install sass
npm install -g gulp
ionic setup sass
You can use sass via Ruby:
Install Ruby
Install Sass: npm install -g node-sass
On ionic project (v2) type: npm rebuild node-sass
So whenever you touch sass file(s), you can just rebuild the sass: npm rebuild node-sass if not, it's OK, just continue normal ionic serve
Remark: ionic2 requires sass
Using Sass in ionic project
if you are using windows node cli. goto in your project by
c:\projectname
after
c:\projectname>ionic setup sass
done
http://ionicframework.com/docs/cli/sass.html
Try this. It will setup the sass in your ionic project.
ionic setup sass
If gulp is not setup then run this command first
npm install gulp -g