I'm using ember-cli to structure my app.
It compiles all the files to the dist/ directory.
However as I inspected the compiled index.html I noticed it was creating this meta tag.
<meta name="user/config/environment" content="%7B%22modulePrefix%22%3A%22user%22%2C%22environment%22%3A%22development%22%2C%22baseURL%22%3A%22/%22%2C%22locationType%22%3A%22auto%22%2C%22contentSecurityPolicy%22%3A%7B%22default-src%22%3A%22%27none%27%20localhost%22%2C%22script-src%22%3A%22%27self%27%20%27unsafe-inline%27%20%27unsafe-eval%27%20use.typekit.net%20connect.facebook.net%20maps.googleapis.com%20maps.gstatic.com%22%2C%22font-src%22%3A%22%27self%27%20data%3A%20use.typekit.net%22%2C%22connect-src%22%3A%22%27self%27%20localhost%22%2C%22img-src%22%3A%22%27self%27%20www.facebook.com%20p.typekit.net%22%2C%22style-src%22%3A%22%27self%27%20%27unsafe-inline%27%20use.typekit.net%22%2C%22frame-src%22%3A%22s-static.ak.facebook.com%20static.ak.facebook.com%20www.facebook.com%22%7D%2C%22EmberENV%22%3A%7B%22FEATURES%22%3A%7B%7D%7D%2C%22APP%22%3A%7B%22LOG_ACTIVE_GENERATION%22%3Atrue%2C%22LOG_VIEW_LOOKUPS%22%3Atrue%7D%2C%22exportApplicationGlobal%22%3Atrue%7D">
This is a problem for my deployment as I'm currently using the ember-app within another page and this meta tag is needed for the ember app to work. Is there a way to make this as part of the javascript compiled file or get rid of this altogether?
The ability to build your app without this was recently added in this PR
You can set it up to be in your compiled JS output by passing in the storeConfigInMeta option. To opt-out, it should look like this in your Brocfile.js
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var app = new EmberApp({
storeConfigInMeta: false
});
module.exports = app.toTree();
This is available in ember-cli 0.1.2 which is the latest version right now
Related
I have already installed tailwind CSS to my django project and it works just fine,
I tried using the documentation procedure I saw at the daisyui website
npm i daisyui
and I also added the plugin to my tailwin.config.js file also
module.exports = { //... plugins: [require("daisyui")], }
I have a working configuration in my environment.js, but want to add a variable. I placed the pageSize variable like so: var ENV = {
contentSecurityPolicy: {
'style-src': "'self' 'unsafe-inline'"
},
modulePrefix: 'fdms-admin',
environment: environment,
ROOT_URL: process.env.ROOT_URL,
BASE_URL: process.env.BASE_URL,
pageSize: 100,
baseURL: '/admin/',
locationType: 'auto',
EmberENV: {
...
When I run ember build and place the assets folder inside of my Java project, the changes to the config are not being picked up. The pageSize variable is undefined on the ENV object. Any ideas?
I usually test by running ember server --proxy http://localhost:8080 --environment local, and the pageSize variable show up just fine.
Not sure which ember version you use but environment variables are placed inside meta tag with name set to ember app that you created and content. So when you say I copied the javascript files did you also included the meta tag after building for production mode
ember build --environment production
Under dist the index.html file contains this line
<meta name="APPNAME/config/environment" content="....
So after you copy script files your html file that loads them should include this meta tag as well. I have seen somewhere that this is possible to export env into js file but forgot how it is setup. In most cases config vars are stored in meta tag.
Hope it helps
Is it possible to exclude jQuery dependency from vendor.js in ember-cli when building for production only? I want to include it separately in my site.
You can control which files will be used in development or production using a hash like configuration. In your case you should use:
var app = new EmberApp({
vendorFiles: {
'jquery.js': {
development: 'bower_components/jquery/dist/jquery.js',
production: false
}
}
});
Refer to Customizing a built-in asset section for further info.
At the end the only thing worked for me was this:
var app = new EmberApp({
vendorFiles: {
production: false,
development: 'bower_components/jquery/dist/jquery.js'
}
});
This will exclude it in production but not in development.
This is a rather simple matter, check the bower.json file in your directory and remove the jquery entry, or simply run bower uninstall jquery --save in the cli.
Oups missed the in production only, well you can save it as a dev-dependency that way it's not included in the build.
So remove jquery and then run bower install --save-dev jquery
when using ember-cli I would like to be able to include an external js library which requires an API key and I would like to use a different API key in development vs production.
Essentially I would like to add the following script tag to app/index.html
<script type="text/javascript" src="http://something.com?key=API_KEY"></script>
but I would like API_KEY to be different when I'm running in development as opposed to production.
Thanks for the help!
Have a look at the ember-inject-script addon which makes it easy to include 3rd party scripts in your ember-cli app. To use it, npm-install the addon then use an initializer to load the script. Then set different values for API_KEY in your config/environment.js
npm install --save-dev ember-inject-script
ember generate initializer something-dot-com
Then edit the initializer as follows
import injectScript from 'ember-inject-script';
import config from '../config/environment';
export default {
name: 'something-dot-com',
initialize: function() {
var url = "//something.com?key=" + config.SOMETHING_API_KEY;
injectScript(url);
};
}
And in config/environment.js
ENV.SOMETHING_API_KEY = 'YOUR_DEV_API_KEY';
if (ENV.environment === "production") {
ENV.SOMETHING_API_KEY = 'YOUR_PROD_API_KEY';
}
I've set up a website using Ember-CLI and it is now ready for production, so we're looking for a way to keep it running permanently.
Right now we're using $ ember serve --port 80
but obviously this only works whilst we're logged in. I've used Forever before to keep a node app running but am not sure how to make this work with Ember CLI, as the 'ember serve' command obviously does more than just running app.js?
Any input would be appreciated!
Ember-CLI apps are NOT node apps, they are Browser apps, so you don't need anything special to serve them. To keep and Ember-CLI app running permanently, I suggest doing:
ember build --environment=production
This will perform the necessary build steps so that the code works in browsers (e.g, transpiling ES6 modules) and put the code in the build folder. It will also minify JS files and fingerprint all resources (this only happens when the environment is production).
All you have to to then is put the files inside the dist/ folder on a Web Server.
I suggest Apache or Nginx, but anything will work.
Edit
As Omair Vaiyani pointed out, this might not work in some servers because Ember-CLI
uses the locationType: 'auto' which defaults to 'history'. For that to work, you have to configure your SERVER to serve the ember app from all routes.
What I do, and server me well because I don't have control over the server, is to simply change the locationType to 'hash', which will generate URLs with hashes (http://myemberapp/#/myroute/myid) and will work with any server. Just edit the environment.js file accordingly:
module.exports = function(environment) {
var ENV = {
/* other stuf ... */
locationType: 'hash',
/* other stuf ... */
},
/* other stuff */
```