I tried adding a .env file to the root of my directory and I tried accessing the contents with
[#bs.val] external graphqlUrl : string = "process.env.GRAPHQL_URL";
but it when I Js.log(graphqlUrl); it's undefined!
.env file:
GRAPHQL_URL=https://api.example.com
How do I access it?
Thank you!
I followed sir Rem Lampa's suggestion and installed dotenv-webpack on my project. Then I followed the instructions on the dotenv-webpack docs.
The webpack.config.js file now looks like this:
const path = require('path');
const outputDir = path.join(__dirname, "build/");
const isProd = process.env.NODE_ENV === 'production';
const Dotenv = require('dotenv-webpack');
module.exports = {
entry: './src/Index.bs.js',
mode: isProd ? 'production' : 'development',
output: {
path: outputDir,
publicPath: outputDir,
filename: 'Index.js',
},
plugins: [
new Dotenv()
]
};
Related
I'm having issues setting up an express server instance on serverless with nextJs. I keep getting a Cannot read property 'getCompilationErrors' of undefined when running the server function. It seems to be an issue with app.render.
When running debug it seems to be coming from within nextJs
Server.js
const express = require('express');
const path = require('path');
const dev = process.env.NODE_ENV !== 'production';
const next = require('next');
const pathMatch = require('path-match');
const app = next({ dev });
const handle = app.getRequestHandler();
const { parse } = require('url');
const server = express();
const route = pathMatch();
server.use('/_next', express.static(path.join(__dirname, '.next')));
server.get('/', (req, res) => app.render(req, res, '/'));
server.get('*', (req, res) => handle(req, res));
module.exports = server;
index.js
const sls = require('serverless-http')
const binaryMimeTypes = require('./binaryMimeTypes')
const server = require('./server')
module.exports.server = sls(server, {
binary: binaryMimeTypes
});
Serverless.yml
service: ssr-react-next
provider:
name: aws
runtime: nodejs8.10
stage: ${self:custom.secrets.NODE_ENV}
region: us-east-1
environment:
NODE_ENV: ${self:custom.secrets.NODE_ENV}
functions:
server:
handler: index.server
events:
- http: ANY /
- http: ANY /{proxy+}
plugins:
- serverless-apigw-binary
- serverless-domain-manager
custom:
secrets: ${file(secrets.json)}
apigwBinary:
types:
- '*/*'
customDomain:
domainName: ${self:custom.secrets.DOMAIN}
basePath: ''
stage: ${self:custom.secrets.NODE_ENV}
createRoute53Record: true
# endpointType: 'regional'
# if the ACM certificate is created in a region except for `'us-east-1'` you need `endpointType: 'regional'`
Figured a way around this, just needed to prepare the app with async
server.use(async(req, res, next) => {
await app.prepare();
next();
})
Did you add this in the server.js so it looks like this?
server.js after server.use('/_next', express.static(path.join(__dirname, '.next')))
server.use(async(req, res, next) => {
await app.prepare();
next();
})
I defined a l.js under /api/services
exports.i = sails.log.info;
exports.v = sails.log.verbose;
exports.err = sails.log.error;
exports.w = sails.log.warn;
exports.d = sails.log.debug;
It works fine but when I want to define custom logger in /config/log.js
let customLogger = new (winston.Logger)({
transports: [
new (winston.transports.Console, winston.transports.File)({
name: 'file.info',
level: 'info',
filename: logPath + '/server-info.log',
json: true
}),
new (winston.transports.Console, winston.transports.File)({
name: 'file.warning',
level: 'warning',
filename: logPath + '/server-warning.log',
json: true
}),
new (winston.transports.File)({
name: 'file.error',
level: 'error',
filename: logPath + '/server-error.log',
json: true
})
]
});
module.exports.log = {
level: 'info',
custom: customLogger,
};
When I use sails.log.error("123"); l.err("456") in controller, only "123" showed in server-error.log file. "456" only print to console.
When I check sails doc about lifecycle, it seems /config/log.js loaded before /api/services. How should I modify my code?
Thanks
Although config/log.js is loaded before api/services/l.js, (my feeling is) assignment of custom logger defined in log.js to sails.log.<level> happens after the service is loaded.
Hence the behavior.
Re-assigning on lifted event fixes this. Use this code in l.js:
exports.err = sails.log.error;
sails.on('lifted', function() {
console.log('lifted event');
// Re-assign here
exports.err = sails.log.error;
});
Do similarly for other methods of the service.
I wanted to moved some files between two folders in an ember app when build is run but I am having no success.
//ember-cli-build.js
module.exports = function (defaults) {
var app = new EmberApp(defaults, {
hinting: false,
minifyCSS: {
enabled: true
},
bless: {
enabled: true
}
});
var moveFile = new Funnel('./app/locales', {
srcDir: 'en',
files: ['test.js'],
destDir: 'en_US',
allowEmpty: true
});
return new MergeTrees([moveFile, app.toTree()]);
};
When I do the build, I get no errors but the file is also not getting moved.
UPDATE: I am trying to move the file before ember-cli puts compiles the files and puts it in the dist folder
You can use broccoli-static-compiler https://github.com/joliss/broccoli-static-compiler
In brocfile.js ( ember-cli-build.js )
// at top of file
var pickFiles = require('broccoli-static-compiler');
var mergeTrees = require('broccoli-merge-trees');
// inside exporting function
const bootstrapMap = pickFiles('bower_components/bootstrap/dist/css/',
{
srcDir: '/',
files: ['bootstrap.css.map'],
destDir: '/assets'
});
// and so on, as many times as you need
const zeroClipboard = pickFiles('bower_components/zeroclipboard/dist/',
{
srcDir: '/',
files: ['ZeroClipboard.swf'],
destDir: '/assets'
});
// at the end
return mergeTrees([
app.toTree(),
bootstrapMap,
zeroClipboard,
// ...
], { overwrite: true });
With 'broccoli build', your app is build into a destination folder, so broccoli is the wrong tool to move files in an existing folder structure. Here I'm assuming it's run with something like 'broccoli build dist' on the command line which will create a new folder 'dist' with the results of the build, and error out if the directory already exists.
So let's say your project directory looks like this:
.
|--brocfile.js
|--app/
|--locales/ <----- funnel root
|--en/ <----- srcDir
|--test.js <----- file
When you funnel from ./app/locales, your srcDir and files` are relative to that as a root. The output tree is then put into the 'destDir' under the build output directory. What that will do is this:
.
|--brocfile.js
|--app/ <----- not changed
|--dist/ <----- build output directory
|--en_US <----- destDir
|--test.js <----- file
I think you want your destDir to be locales/en_US or app/locales/en_US.
Im trying to deploy to a staging site with gulp-rsync. I'm not receiving any errors but it's not deploying to My server. I would also expect to be asked for the password, which is not happening.
var gulp = require('gulp'),
gutil = require('gulp-util'),
sass = require('gulp-sass'),
autoprefixer = require('gulp-autoprefixer'),
minifycss = require('gulp-minify-css'),
jshint = require('gulp-jshint'),
stylish = require('jshint-stylish'),
uglify = require('gulp-uglify'),
concat = require('gulp-concat'),
rename = require('gulp-rename'),
plumber = require('gulp-plumber'),
bower = require('gulp-bower'),
sftp = require('gulp-sftp'),
rsync = require('gulp-rsync');
gulp.task('deploy', function() {
gulp.src('build/test_for_rsync')
.pipe(rsync({
root: 'build',
hostname: '*****.wpengine.com',
username: '*****',
port: 2222,
destination: '/wp-content/themes/',
incremental: true,
progress: true,
relative: true,
exclude: ['/node_modules', '/bower_components'],
recursive: true
}));
});
Try using return keyword before gulp.src:
gulp.task('deploy', function() {
return gulp.src('build/test_for_rsync')
.pipe(rsync({
root: 'build', ...
I have Ember-CLI-application with a few thousand static assets (~1GB) and my build time is now about 30sec.
I have tried in my Brocfile.js without success:
var app = new EmberApp({
fingerprint: {
enabled: false,
exclude: ['large_folder']
}
});
Build time with assets: TreeMerger | 29738ms
/ without: TreeMerger | 9182ms.
Any ideas how to speed up the build?
(Ember-CLI 0.1.7)
You have enabled:false, you can set it to true.
Also, on exclude, would be better to say the path for the folder, such as:
If you have a large folder inside images, then you can do it like this:
fingerprint: {
exclude: ['assets/images/large_folder/', 'assets/uploads/other_large_folder/]
}
My own solution is currently to use the postBuild-hook and a symbolic link to the assets folder.
lib/link-after-build/index.js:
var fs = require('fs');
var path = require('path');
module.exports = {
name: 'link-after-build',
// link additional assets after build
postBuild: function(result) {
if (process.env.EMBER_ENV === 'development') {
var buildDirPath = result.directory;
var srcpath = path.resolve("/opt/local/apache2/htdocs/large_folder");
var dstpath = path.resolve(buildDirPath + "/large_folder");
fs.symlinkSync(srcpath,dstpath);
}
}
};