How to automatically save files in a directory? multer nestjs - javascript

How can multer on nestjs automatically save a file to a directory? I watched that if you register the MulterModule module and specify the path in it, all files will be saved to this path:
#Module({
imports: [
MulterModuleLib.register({
dest: './uploads'
})
]
})
export class MulterModule {
}
But it doesn't work, the uploads directory is not created and the files are not saved.
P.S MulterModule imported into app.module
I know that you can save everything manually, but I would like everything to work automatically.

Related

Set specific path for assetPath GaussianBlurBackgroundProcessor (Twilio) - reactj

I'm trying to implement a Twilio background blur, using the GaussianBlurBackgroundProcessor. You can check the docs here.
I need to find a way to set a path for a folder but for a specific reason, I don't want to use the public react folder.
I tried to use the CopyWebpackPlugin to copy the files for the build folder and did work but when I tried to run the application using the development start script the files are not available.
Do you have any clue how can I set the assetPath without using the public folder and add the specific folder to the bundle?
assetPath - https://twilio.github.io/twilio-video-processors.js/interfaces/gaussianblurbackgroundprocessoroptions.html#assetspath
CopyWebpackPlugin
new CopyPlugin({
patterns: [
{
from: "node_modules/#twilio/video-processors/dist/build",
to: "static/blur",
noErrorOnMissing: false
},
],
})
Thanks

Set up webpack to pull JS file from local rather than via HTTP

webpack.config.js pulls remote js for Module Federation.
plugins: [
new ModuleFederationPlugin({
remotes: {
'mfe1': "mfe1#http://xxxxxxxxxx.com/remoteEntry.js"
}
})
],
How can I use a local JS file in remotes or in addition to remotes? I have a simple react.js library in the other folder, with ./dist/browser/remote-entry.js file in it. I cannot publish to npm, so I'm trying to load it from local. Would it be something like:
plugins: [
new ModuleFederationPlugin({
remotes: {
'mfe1': "../../myproject/dist/browser/remoteEntry.js"
}
})
],
The remotes entry is supposed to be a url that is accessible during run-time, not build-time. If it was only necessary during build-time, it would automatically imply that the remoteEntry gets bundled, which defeats the purpose of Webpack Module Federation (WMF for short).
You say:
webpack.config.js pulls remote js for Module Federation.
But I'm not sure what that is supposed to mean. Webpack does not "pull" the remote files at all. It tells the final build where to look, so that when your code (i.e. bundle.js) actually executes, it knows from where to load modules dynamically.
This means that, in order for WMF to work, you still need to serve the file from your web server.
You primarily have two choices:
If you don't want dynamic loading of modules, just build your project without WMF.
If you do want dynamic loading, then you need to tell webpack that remotes url. Ideally, you can get the actual server address from process.env, which you can provide via dotenv (or through many other means):
webpack.config.js
// ...
module.exports = {
// ...
plugins: [
new ModuleFederationPlugin({
remotes: {
'mfe1': `mfe1#${process.env.REMOTE_HOST || 'http://localhost:8080'}/remoteEntry.js`
}
})
],
// ...
};
.env
REMOTE_HOST=http://xxxxxxxxxx.com
Also, you might want to consider this article on how to deploy a WMF build.

Public path issue with webpack chunk name dynamic imports

Im importing the vue app if a specific class name exists. So basically its dynamically importing. Below is the code for webpackChunk. In home.js file I check if element exists and dynamically load it.
if (elementExists) { import(/* webpackChunkName: "vue" */ '../vue/main.js') }
In the production build, I get vue.js and vendor~vue.js which is refered in the home.js file for dynamically loading it in production build. But the path for these 2 files gives me 404 error. So basically the path seems to be an issue. In webpack config I have specified the chunkFileName as
chunkFilename: 'scripts/[name].js',
Can someone suggest how to solve the path issue in prod

Modify config file during release

Current situation
We have many clients using our client application software. The problem is we need to connect to different REST endpoints. The base URL is always different.
Currently we're using a config.json file which we're manipulating during release. A simple example
config.json
{
"endpoint": "http://localhost/api"
}
During startup of our application we're doing an HTTP call to get this file. For further API calls we're using the endpoint provided by the config.json file.
Desired outcome
What we really want is this becomes part of our applications instead of doing the HTTP call. We're using webpack to build our application.
In our dataservice layer we want to do something as follows:
import config from './config';
// use config.endpoint;
config.js
export default {
endpoint: "http://localhost/api"
};
We can override the confg.js file during build. But since we have many clients (+- 30) we don't want to build for each client. We just want one build and modify the config.js file during release with the correct configuration.
Basically we want webpack to ignore the file during build and copy the file to the output folder + inject it in index.html.
I've done some research and I'm not sure how to solve ths issue. Maybe the initial HTTP call isn't that bad afterall?
Edit: the endpoint is just an example, we have more client specific configuration defined in our client app
Ok, this was easier than expected. I simply added a new entry with the config file.
entry: {
config: "./src/config.ts",
app: "./src/main.ts"
}
In the UglifyJsPlugin I added an exclude for the config file.
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
exclude: /(config).+/i,
sourceMap: true
}),
The output is a "readable" config file.

Browserify working with grunt ReacjJS and yii2 vendor path

Background
I'm trying to setup a Yii2 project with Browserify to manage JS dependancies. As Yii2 places JS and CSS dependancies in the vendor/bower directory, i'm trying to configure Browserify to use this as the include path for vendor dependancies.
I have a Grunt task setup to run my js build.
Problem
When I try to compile my js files using the Grunt task I am getting an error trying to find React (the first include in my js project).
Error: Cannot find module 'react' from '{my-working-directory}/modules/contact/asset/js'
Code
I have React installed (bower install) and available in my vendor/bower directory. My project JS src files i'm trying to build are located in modules/contact/asset/js/. In my JS files i'm including React at the top of the file.
modules/contact/asset/js/main.jsa
var React = require('react');
var component = React.createClass({
render: function() {
...
}
});
...
I have setup my Grunt browserify task with the include paths so that browserify knows how to find my includes, I have additionally added the react transform so that the JSX gets compiled into js.
Gruntfile.js
...
browserify: {
options: {
transform: [ require('grunt-react').browserify ],
browserifyOptions: {
paths: [
'./vendor/bower/',
'./modules/contact/asset/js/'
]
}
},
client: {
src: [
'./modules/contact/asset/js/*.js'
],
dest: './modules/contact/web/js/main.min.js'
}
},
...
Question
Why is browserify not able to find react or other includes?
You can't and should't access to vendor directory from web. If your website loaded from web folder, then you can only access only files and folders in web directory.
You can use AssetBundle to register scripts from vendor/bower directory:
class ReactAsset extends AssetBundle
{
public $sourcePath = '#bower';
public $js = [
'react/react.js'
];
}
See more in documentation.

Categories

Resources