Nette - importing naja library - nette

I have a question. I need to make some modification to our nette application (first time working with the framework). I need to import NAJA lib via FTP and by downloading code from github. I do not have access to server or console, so download via composer, npm... is not possible.
I done this:
Downloaded all files from https://github.com/jiripudil/Naja/releases (not the ZIPs) and put them in directory vendor
loaded in app/presenters/templates/#layout.latte with:
<script src="{$basePath}/js/vendor/Naja.js" type="module"></script>
Tried to inicialize it in one of my javascript with:
document.addEventListener('DOMContentLoaded', naja.initialize() );
But then error pop up, saying that naja is not defined. What am I missing?

Naja is written using modern JavaScript, it can be initialized only via ES5+ import, for instance
import naja from 'naja';
and then the event listener for initializing naja can be added after that code, and it can be compiled via webpack like this https://github.com/MinecordNetwork/Website/blob/master/webpack.config.js
You can do it all on your local machine with npm and yarn installed, and then upload bundle.js that was built to the server, it's also used in the mentioned repository so you can check out how and what libraries are needed, to compile the code from /public/js/main.js type yarn encore production or yarn build for development.

Related

error deploying react project with font-awesome import

I'm trying to npm run deploy on my project where I'm storing the minified font-awesome css file and I'm getting the following error:
Creating an optimized production build...
Failed to compile.
./src/assets/css/font-awesome.all.min.css
ParserError: Syntax Error at line: 1, column 30
The app works fine on development sever.
The error shows whether I'm importing the css to the main css file or the main js file.
I only found some related old posts with potential solutions for a next.js project and yarn like in this link: https://github.com/vercel/next-plugins/issues/310
This is a react project and I'm using npm.
Any suggestions?
Can't comment on this unless there's more information regarding module-bundler and what is the configuration for the same. As it's treated differently according to module-bundler.
I would suggest you to use official package of fontawesome for react #fortawesome/react-fontawesome
PS. Module Bundler configuration should not be changed without proper knowledge as it can make whole application crash.

Imported deno thirdparties in production

Deno does not use any package manager like npm, it only imports the thirdparty dependencies with a URL. Lets see an example below:
import { Application } from "https://deno.land/x/abc#v1.0.0-rc8/mod.ts";
Does the deployed code in production contain the content of https://deno.land/x/abc#v1.0.0-rc8/mod.ts or the server in production has to send a request to the URL to get the thirdparty code?
For production, deno recommends saving your dependencies to git, if you follow that recommendation, then your server won't need to download anything since it will already be cached.
In order to do that you have to set the environment variable DENO_DIR to specify where do you want to download dependencies.
DENO_DIR=$PWD/vendor deno cache server.ts
# DENO_DIR=$PWD/vendor deno run server.ts
With the above command, all dependencies for server.ts will be downloaded into your project, inside vendor/ directory, which you can commit to git.
Then on the production server, you'll have to set DENO_DIR to read from vendor/ and not for the default path, which can be obtained by issuing:
deno info
If you don't store the dependencies on your version control system, then deno will download the dependencies once, and store them into DENO_DIR directory.
Taken from deno manual:
But what if the host of the URL goes down? The source won't be available.
This, like the above, is a problem faced by any remote dependency
system. Relying on external servers is convenient for development but
brittle in production. Production software should always vendor its
dependencies. In Node this is done by checking node_modules into
source control. In Deno this is done by pointing $DENO_DIR to some
project-local directory at runtime, and similarly checking that into
source control:
# Download the dependencies.
DENO_DIR=./deno_dir deno cache src/deps.ts
# Make sure the variable is set for any command which invokes the cache.
DENO_DIR=./deno_dir deno test src
# Check the directory into source control.
git add -u deno_dir
git commit

Not taking reference from node_modules while creating angular 6 from VS-2017

I have created one angular 6 application using visual studio 2017.
Here is the screenshot for my visual studio project (Angular).
As you can see I have added one new component and service named as Todo.
When I am adding todo.service.ts I need to add some references of angular modules so that I can avail HttpClient, HttpHeaders, HttpParams , catchError, tap, map features.
But here seems like I am not able to refer the path to the angular module package which we can easily refer while creating project using cli command because there we have node_modules folder where we have all packages and importing file using below command
import { HttpClient, HttpHeaders, HttpParams } from '#angular/common/http';
import { catchError, tap, map } from 'rxjs/operators';
but here in VS-2017 I am not able to refer the package.
It give me an error like "can not find modules"
Here is the screen shot for the same.
Please suggest me what to do here how to refer to angular packages while creating angular project in VS-2017.
Note there is no error in referring to the package because the same code is working while creating project using angular CLI command.
Navigate to directory where package.json file is placed
Run
npm install
If still the issue persists
Install required package using npm:
npm i <package-name> --save
Do this ,
Replace /common/http to common only
Same for operators
I got the solution..
You can rename or deleted the existing node_modules folder.
Then create new project using angular-cli command.
Then paste the copy the node_modules(step 2) to my .NET folder (step1).
Now, it start working.
Thanks for your all suggestion guys..

Use gulp locally outside node

I would like to use gulp in my Wordpress project. Is it possible to execute gulp functions outside a node JS project?
I'm running on OSx, but couldn't find anything on the internet about it. Or do I'll have to use another lib like Grunt?
Yes, the main language of your project doesn't affect whether or not your can include some node.js dependencies and run them. You will need to have gulp installed and have a gulpfile.js in your project, and then you can run it.
You could install gulp globally on the server (npm install -g gulp), but I recommend creating a package.json file (using npm init) in your project, so that your node.js dependencies are tracked in your version control, and installing gulp with npm install --save gulp (inside your project's directory). Since gulp won't be installed globally in that case, you will need to use "$(npm bin)"/gulp from a directory inside your project to run it.
I use Yeti Launch from the Zurb foundation for the same setup (no node installed on my Mac).
When you run it, it will create a Foundation frame but you can do the following:
Stop the project it creates from within its interface,
Delete the files it creates and replace with yours
Leave the project it shows in the interface
Leave the "node_modules" folder it creates
Start the project again
This will run your Gulp file.
The only issue is installing node modules. For this, I look at any error messages it gives regarding missing modules and copy these into the "node_modules" folder from Github
The short answer is no. Gulp is distributed as a npm package and has node.js as a dependency BUT that doesn't mean you can't use it outside of a node.js project.
The only real need for Gulp on a wordpress project would likely either be at the theming layer or if you were doing a custom plugin. Assuming you are making a theme, some of them use Gulp extensively.
I've used the Roots ecosystem's Sage theme successfully on a number of projects. It has node/npm dependencies but they are all included if you use the theme. Check out their Gulp file - it's probably close to what you are philosophically looking for.

How to specify local npm modules in meteor packages

I have an application which uses a Meteor with npm module. So I have a packages/mymodule/package.js file which contains:
Npm.depends({my_npm_module:"my_npm_module_version"});
Upon lauching Meteor app, my_npm_module will be installed to packages/mymodule/.npm from npm repository. Now lets say I want to develop my_npm_module on my local machine. How can I force Meteor to use my local directory for my_npm_module, What should I do i my_npm_module source is modified?
If you have a local Npm module it may not be necessary to do this.
Simply use var module = Npm.require('<absolute path to npm module>'); anywhere on your server side.

Resources