Removing console logging from Ember etc apps - ember.js

Wondering if there’s any built-in way or addon for removing console output from production builds of Ember apps.... I do a lot of debugging via console statements and sometimes these get a bit weird and would like to fid an easy way to remove the chance of this cruft making it into production builds.

If this is a standard ember-cli based project, you can strip console messages by updating the uglify configuration in ember-cli-build.js.
let app = new EmberApp(defaults, {
'ember-cli-uglify': {
uglify: {
compress: {
drop_console: true
}
},
},
// Add options here
});

Related

Use Cloud SDK in unit tests

I followed the guide here - https://sailsjs.com/documentation/concepts/testing
So my lifecycle.test.js looks like this:
var sails = require('sails');
// Before running any tests...
before(function(done) {
// Increase the Mocha timeout so that Sails has enough time to lift, even if you have a bunch of assets.
this.timeout(5000);
sails.lift({
// Your sails app's configuration files will be loaded automatically,
// but you can also specify any other special overrides here for testing purposes.
// For example, we might want to skip the Grunt hook,
// and disable all logs except errors and warnings:
hooks: { grunt: false },
log: { level: 'warn' },
}, function(err) {
if (err) { return done(err); }
// here you can load fixtures, etc.
// (for example, you might want to create some records in the database)
return done();
});
});
// After all tests have finished...
after(function(done) {
// here you can clear fixtures, etc.
// (e.g. you might want to destroy the records you created above)
sails.lower(done);
});
However in my test I am not able to use Cloud. I thought this was available to me because I saw in test suites here that they use Cloud - https://github.com/mikermcneil/ration/tree/master/test/suites
Do i have to modify my lifecycle.test.js to use Cloud?

How to implement vuex-persistedstate in vue/ssr

I need to persist state in vue ssr app, but can't understand how to implement this.
As storage, I want to use cookies.
When I install the plugin as written in readme nothing happens, that it's strange: I expect an error because js-cookies calls "window".
The question is: how to implement vuex-persistedstate in vue/ssr?
I can access cookies in req.cookies, but I can't set cookies in the browser, and this expected because my store fill on server side, and js-cookies calls on server side.
Until the they fix this in source code, I managed this way:
storage.js
import CreatePersistedState from 'vuex-persistedstate'
let PersistedState
if (process.browser) {
PersistedState = CreatePersistedState(yourOptions)
}
export default PersistedState
store.js
import CreatePersistedState from 'src/util/plugins/storage'
...
const plugins = []
if (process.browser) {
plugins.push(CreatePersistedState)
}
export default function createStore() {
return new Vuex.Store({
state,
modules,
actions,
mutations,
getters,
strict: false,
plugins: plugins
})
}

Ember - using api/server data

I am new to ember and I like what I see so far. I have done the tutorial and found to to be pretty easy to get something up and running. My question has to do with using mirage vs real data. I used mirage to stub in some data but now I would like to link to to real data. I would think this should not be too hard since I have the models..etc set up I just need to call an api instead of mirage. I have not seen a clean example of how best to do this.
Thanks
You can turn mirage on/off for all requests per environment in config/environment.js e.g. off for development, on for testing,
// config/environment.js
if (environment === 'development') {
ENV['ember-cli-mirage'] = {
enabled: false
};
}
if (environment === 'test') {
ENV['ember-cli-mirage'] = {
enabled: true
};
}
Or if you leave mirage on for everything, allow specific endpoints to with passthrough:
http://www.ember-cli-mirage.com/docs/v0.3.x/configuration/#passthrough

Ember >2.2.0 getting regeneratorRuntime is not defined

so I was working with an iterator inside a service with Ember. The code worked using the old style scripts I cannot use the ES2015 style
ReferenceError: regeneratorRuntime is not defined
stuff[Symbol.iterator] = function *(){
debugger;
let properties = Object.keys(this);
for(let p of properties){
yield this[p];
}
};
I know this is because of the new '*' operator on the function. I have seen answers https://stackoverflow.com/a/28978619/24862 that describe having to load a browser-polyfill npm but I'm a little unclear how to get this to work inside the ember framework. Has anyone done this successfully? or should I just abandon until Ember supports it.
Polyfill
Babel comes with a polyfill that includes a custom regenerator runtime and core-js. Many transformations will work without it, but for full support you may need to include the polyfill in your app.
You should now include as ember-cli-babel and not as babel. Like this:
var app = new EmberApp(defaults, {
'ember-cli-babel': {
includePolyfill: true
}
}
Regenerator:
This package implements a fully-functional source transformation that takes the syntax for generators/yield from ECMAScript 2015 or ES2015 and Asynchronous Iteration proposal and spits out efficient JS-of-today (ES5) that behaves the same way.
Sources: https://github.com/babel/ember-cli-babel and https://github.com/facebook/regenerator
Perhaps your use of Babel.js needs to include the polyfill, in your ember-cli-build.js file use:
var app = new EmberApp(defaults, {
// Add options here
babel: {
includePolyfill: true
}
});

Activating Feature Flags with Ember CLI

I was reading the documentation here, and it looks like I should be able to activate feature flags like this in my config/environment.js file:
var ENV = {
EmberENV: {
FEATURES: {
'new-computed-syntax': true,
'ember-htmlbars-component-generation': true
}
}
}
Yet this doesn't seem to be enough, even after restarting ember server. Any suggestions?
Nevermind, just found the answer. I had to be on canary to get access to the code. You can find out how to be canary here.