If one wants to jump start a project in Node.js with express. one would use express-generator. After creating a new project your file tree will look like this
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.pug
├── index.pug
└── layout.pug
One thing that stood out for me is that to run the app you need to do node bin/www or a predefined shortcut npm run. My question is why would one use the www the way it is and not add a .js extension and remove #!/usr/bin/env node from the top of the file? Are there any benefits of doing it this way or is it a personal preference?
Let's look at the first line of the bin/www file:
#!/usr/bin/env node
This shebang tells the *nix operating system how to interpret the file if you try to run it as a program.
So this file can be started as a program. And in Linux traditionally executable files do not have an extension.
Related
I'm using the verion 2.7 of Parcel for bundling my client side javascript. I have a index.ts where I group all my code. In some cases I have to use dynamic import statements:
example:
const { Menu } = await import('./Menu');
The issue that I can't solve: after each update on Menu.ts, Parcel creates a newly hashed Menu.[hash].js file instead of updating it.
npm run watch:js:
"watch:js": "parcel watch --no-hmr ./public/ts/index.ts --dist-dir ./public/js --public-url ./"
public folder structure:
.
└── public/
├── [...]
├── js/
│ ├── index.js
│ ├── index.js.map
│ ├── Menu.[hash-1].ts **! that's an issue !**
│ └── Menu.[hash-2].ts **! that's an issue !**
└── ts/
├── [...]
├── index.ts
└── Menu.ts
Currently I am working one react js project. there i create two different app in one application (eg. app1 and app2).
i have render two app base on condition i want to deploy this app one by one firstly create build with app1 and
after few time create build with app2.
so what i want to do is when i m create build for folder app1 in that time i don't want move app2 folder in build.
and also don't want to move unnecessary components with build.
so is there any way to exclude my app2 folder from build and others file ? how can i achieve that?
here is my app structure.
.
└── myApplication/
├── public
└── src/
├── app1/
│ ├── assets
│ ├── service
│ ├── hooks
│ ├── components
│ └── index.js
├── app2/
│ ├── assets
│ ├── service
│ ├── hooks
│ ├── components
│ └── index.js
├── router.js
├── App.js
├── index.js
├── app.css
├── service
└── hooks
I'm writing react application with given structure (simplified):
src/
├── containers/
│ ├── ...
│ ├── ...
│ ├── ...
│ └── ...
├── SourceResolver/
│ └── SourceResolver.js
│
└── App.js
SourceResolver.js is a class which contains one method. This method is used in files which are localized into containers folder. I simply create object of this class and then call defined method:
new SourceResolver().getSource();
I don't want to minify this file (or even directory). I want to leave this file like it is in production build (as separte file). Leter if someone would like to change this method it will be possible even in production build.
How can achieve this? I tried to exlude this file/directory in webpack file, but with no success. Is it even possible?
Here is my webpack file https://pastebin.com/xS6QkKzb
Here is my changed webpack file, I tried to add exclude everyhere because I don't know why it doesn't work. https://pastebin.com/6brcNRq3
I have next structure:
jade
├── _skeleton.jade
├── _header.jade
├── _footer.jade
|
├── includes
│ └── _include-on-index.jade
│ └── _include-on-page-1.jade
│ └── _include-on-all-pages.jade
|
├── pages
│ └── index.jade
│ └── page-1.jade
│ └── page-2.jade
│ └── page-3.jade
And I need to setup jade compile, like some apps, (for example Prepros).
It means that if I edit page-3.jade I need compile only page-3.jade, if I edit file that start with _.jade, I don`t need compile exectly this _.jade file like html, but I need to compile all .jade files that included this _*.jade file
For example when I edit file _header.jade, I need compile all files that included _header.jade, if I edit _include-on-index.jade I need to compile file without _ that included _include-on-index.jade
I`m trying to do this with module gulp-jade-find-affected, but it works incorrect, and it compile files that start with _*.jade as html.
Here is my gulpfile.js:
var gulp = require('gulp'),
jade = require('gulp-jade'),
watch = require('gulp-watch'),
affected = require('gulp-jade-find-affected');
gulp.task('watch-jade', function () {
'!sources/jade/_*.jade'
watch('sources/jade/*.jade')
.pipe(affected())
.pipe(jade())
.pipe(gulp.dest('site'));
});
gulp.task('default', ['watch-jade']);
Maybe someone have this gulp task and can help me ?
I used Express generator to create node application. Directory structure looks like the following:
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── node_modules
│ └── jquery
│ └── dist
| |___jquery.min.js
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade
In my index.jade file i try to reuse jquery.min.js from node_modules, instead use url to web source:
doctype html
html
head
link(rel='stylesheet', href= '/stylesheets/style_monit.css')
body
#container
.row
.col-sm-4(style='background-color:lavender;') .col-sm-4
.col-sm-4(style='background-color:lavenderblush;') .col-sm-4
.col-sm-4(style='background-color:lavender;') .col-sm-4
.col-md-4
textarea#inData.form-control(style='background:#222; color:#00ff00;', rows='8')
script(type='text/javascript' src='../node_modules/jquery/dist/jquery.min.js')
css file loads great, but in Chrome console i have error that
GET http://localhost:3000/node_modules/jquery/dist/jquery.min.js
NOT FOUND
I believe the problem is that the node_modules directory is private and shouldn't be exposed to the client. Only static files in the public directory can be served. See this Stack Overflow answer for more information.