I can't seem to be able to resolve this, hoping someone might be able to help.
I have configured a file watcher to check for changes in a source directory. When a change is found, it runs the following tool: -
Program: C:\xampp\htdocs\currentproject\packages\node_modules\.bin\rollup
Arguments: -c C:\xampp\htdocs\currentproject\packages\source_directory\rollup.config.js
It is finding the rollup script OK but then I run into an issue as the rollup.config.js file calls babel as a plugin: -
import babel from "rollup-plugin-babel"
plugins: [
babel({})
],
babel.config.js: -
module.exports = {
presets: [
'#babel/preset-env',
'#babel/preset-react',
],
plugins: [
"#babel/plugin-proposal-class-properties",
"babel-plugin-styled-components"
],
}
It finds this config file OK but then I get the following error: -
(plugin babel) Error: Cannot find module '#babel/plugin-proposal-class-properties' from 'C:\xampp\htdocs\currentproject'
Now I understand how to configure external tools in PhpStorm but #babel/plugin-proposal-class-properties does not have a .bin/executable, only a .js file. I have also tried installing it globally via yarn and created a Windows environment variable to point to the global yarn directory but to no avail - I still get the same error.
Can anyone help me with this?
Related
I cannot seem to find any way to package a puppeteer nodeJS application into a linux/mac/windows binary?
I tried to use pkg but came up with this issue: https://github.com/GoogleChrome/puppeteer/issues/2267
Someone also said to try to use nw but I didn't have any luck there either... possibly due to me not knowing that toolkit at all.
Has anyone had any luck doing this?
You should to create an external folder of chromium and set the path of executable to init puppeteer. Steps :
Create external folder for chromium :
cd nodeProject
mkdir chromium
Copy from chromium-pupeteer directory to new external folder :
xcopy node_modules\puppeteer.local-chromium\win64-756035\ chromium /E /H /I
Set the path of executable to init puppeteer :
const browser = await puppeteer.launch({ executablePath: './chromium/chrome.exe'});
Generate the executable package :
pkg index.js
In brief, the executable alway together with chromium folder :
I have a directory structure like below:
All ES6 files are in the js directory. Now I want after compiling those files to put all of them into a dist directory but I do not know how can I do that.
I've added a Babel watcher in PhpStorm that has this configuration :
program :
D:\wamp\www\vuejs\node_modules\.bin\babel.cmd
Arguments :
$FilePathRelativeToProjectRoot$ --out-dir dist --source-maps --presets env
Output path to refresh :
dist\$FileDirRelativeToProjectRoot$\$FileNameWithoutExtension$.js:dist\$FileDirRelativeToProjectRoot$\$FileNameWithoutExtension$.js.map
What changes should I make in the watcher configuration?
It can look as follows:
Arguments : $FileName$ --out-dir $ProjectFileDir$\public\dist\$FileDirPathFromParent(js)$ --source-maps --presets env
Output path to refresh : $ProjectFileDir$\public\dist\$FileDirPathFromParent(js)$\$FileNameWithoutExtension$.js:$ProjectFileDir$\public\dist\$FileDirPathFromParent(js)$\$FileNameWithoutExtension$.js.map
Working directory: $FileDir$
Note that Working directory: field is usually hidden, you need to expand Other Options: to see it
Let's say I have some.json:
"key" : "value"
I started node.js server.
After that I changed some.json by hand:
"key" : "another value"
When I read this file I see that "key" is "value" but I need "another value".
How to do this without restarting the server?
You can use Nodemon, a utility that will monitor for any changes in your source and automatically restart our server. You can install it globally:
$ npm install -g nodemon
Once installed, start node.js server with nodemon instead of node, for example:
$ nodemon server.js
Took me a little bit of looking around, but watching a file may help you with what you need, using chokidar.
Here's what I did:
export let config = JSON.parse(fs.readFileSync(process.env.CONFIG_PATH!, 'utf-8'));
// Config Watch
chokidar.watch(process.env.CONFIG_PATH!).on('change', (path: string) => {
config = JSON.parse(fs.readFileSync(process.env.CONFIG_PATH!, 'utf-8'));
});
And it worked perfectly :-)
I'm trying to achieve similar viewer annotations like official demo:
lvm-react
I read official blog post and use files from Autodesk Extensions github:
http://adndevblog.typepad.com/cloud_and_mobile/2016/04/markup3d-sample-for-view-data-api.html
But I can't compile extensions from sources (create bundle.js). Tried just npm install, but there are many errors like:
ERROR in ./src/Viewing.Extension.VisualReport/PieChart/PieChart.js
Module not found: Error: Cannot resolve module 'EventsEmitter' in MY_FILES
and
ERROR in ./src/Viewing.Extension.StateManager/Viewing.Extension.StateManager.scss
Module parse failed: /MY_PATH/library-javascript-viewer-extensions-master/src/Viewing.Extension.StateManager/Viewing.Extension.StateManager.scss Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
I also installed webpack using npm, but without result, there are still many errors.
There was a few loaders missing from the webpack build production config. It is fixed now and you should be able to build all extensions. Please use the latest version from the repo.
When testing your extensions, I recommend you use npm run build-dev command, so the generated extensions files will not be minified and have source-map enabled, so you can easily debug them in browser console. When building for production, you can use npm run build-prod.
You can also remove the various entries from the webpack config to build only the extensions you are interested in, for example:
module.exports = {
devtool: 'eval-source-map',
entry: {
'Viewing.Extension.Markup3D':
'./src/Viewing.Extension.Markup3D/Viewing.Extension.Markup3D.js',
},
// ... rest of the config ...
You may also want to change the output path, in my config the output is outside of the extensions directory, directly in the project using them:
output: {
path: path.join(__dirname, '../../App/dynamic/extensions'),
filename: "[name]/[name].js",
libraryTarget: "umd",
library: "[name]",
watch: true
},
In addition to including the extension file to your project, you should also make sure that you include the babel polyfill (from node_modules/babel-polyfill/dist/polyfill.min.js) before any extension script.
Hope that helps, let me know if you have any further trouble using those extensions.
I am very new to the concept of npm-install. Please throw some insights into where I might be going wrong. I have a .js file through which I am supposed to invoke a binary with some command line arguments.I did write package.json setting the main parameter to the javascript file and I am using preinstall script that compiles the code and creates a binary that is supposed to be used by my java script file.
Couple of questions:
How do I make package.json take this compiled binary as dependency for the js file?
npm install runs fine for me but I do not see any output folder whatsoever. I was hoping it would generate a .node_module in pwd and copy the contents onto bin/ folder in that. May be, I am missing something.
npm info prepublish test#0v.0.1
npm verb from cache <pwd>/package.json
npm verb readInstalled returning test#0.0.1
npm verb exit [ 0, true ]
npm info ok
Can someone please through some insights into this issue?
You don't have to include your binary file in package.json. If you're using Express, put it in the node-modules folder within the parent directory. Otherwise, you can either specify the whole path to the file where you call it or put the file in the parent directory. For global installations, the node-modules folder is usually created at: C:\Users\[Username]\AppData\Roaming\npm\node_modules.
I figured out a way to handle it. Using a js module and using my node as required in that module causes npm to setup my node in node_modules/ folder. I used a pre-install shell script to compile my binary and used the relative path to use the binary upon execution.
Thanks for all who replied.