I'm trying to use LestMove to be more precise
the second implementation method where it says:
Option 2:
Copy the following files into your project:
PFMoveApplication.h
PFMoveApplication.m
If your project has ARC enabled, you'll want to disable ARC on the above files. You can do so by adding -fno-objc-arc compiler flag to your PFMoveApplication.m source file. See How can I disable ARC for a single file in a project?
If your application is localized, also copy the 'MoveApplication.string' files into your project.
Link your application against Security.framework.
In your app delegate's "-[applicationWillFinishLaunching:]" method, call the PFMoveToApplicationsFolderIfNecessary function at the very top.
but I'm not able to call the method / Class, could someone help me with this issue? Thanks in advance!
In general, there are a couple of ways to set up an Objective-C class in your AppleScriptObjC project:
Add the file(s) to the project - the Objective-C class name will be
the one used in the #interface/#implementation declarations
Add an outlet property in the AppleScript class/script you are using, e.g. property someProperty : missing value
Instantiate the class programmatically:
set someProperty to current application's ClassName's alloc's init()
or
Connect stuff up with the Interface Builder:
Add an NSObject (blue cube) from the library to your project
Set the class of the object/cube to the class name of the Objective-C file(s) in the Identity Inspector
Connect the AppDelegate IB Outlet to the object/cube in the Connections Inspector
After setting up the outlet property, the Objective-C methods can be used like any other script/class:
someProperty's handler()
That LetsMove project wasn't really set up for AppleScriptObjC, but I was able to tweak it a bit to get it running. I'm not that great at writing Objective-C, but the following worked for me using a new default AppleScript project with Xcode 10 in Mojave (the original file is over 500 lines long, so I'm just highlighting the changes):
Add PFMoveApplication.h and PFMoveApplication.m files to the project (the class name is LetsMove)
Add Security.framework to Link Binary With Libraries in Build Phases
As described in the original project README, add the compiler flag -fno-objc-arc to the Objective-C file in Compile Sources of the Build Phases
-- Now to alter the Objective-C files a bit:
Move the #interface declaration to the .h file and include the redefined method signatures below in it:
The PFMoveToApplicationsFolderIfNecessary and PFMoveIsInProgress methods are redefined as instance methods:
- (void)PFMoveToApplicationsFolderIfNecessary;
- (BOOL)PFMoveIsInProgress;
Redefine the above method signatures in the .m file, and include those methods in the #implementation section - to do this, move the #end to just before the helper methods (after the PFMoveIsInProgress method)
Remove the isMainThread statement at the beginning of the PFMoveToApplicationsFolderIfNecessary method - this is not not needed (AppleScript normally runs on the main thread), and fixes another issue
There is still a little stuff in there from the original app such as NSUserDefaults, so for your own project, give it a look to see if anything else needs changing (dialog text, etc)
And finally, in the AppDelegate.applescipt file, the following was added to applicationWillFinishLaunching:
current application's LetsMove's alloc's init()'s PFMoveToApplicationsFolderIfNecessary()
I'm having difficulty with my in-repo addon writing to appDir/public. What I'd like to do is write out a JSON file on each build to be included in the app /dist. The problem I'm running into is when running "ember serve", the file watcher detects the new file and rebuilds again, causing an endless loop.
I've tried writing the JSON file using preBuild() and postBuild() hooks, saving to /public, but after build, the watcher detects it and rebuild over and over, writing a new file again each time. I also tried using my-addon/public folder and writing to that, same thing.
The only thing that partially works is writing on init(), which is fine, except I don't see the changes using ember serve.
I did try using the treeForPublic() method, but did not get any further. I can write the file and use treeForPublic(). This only runs once though, on initial build. It partially solves my problem, because I get the files into app dist folder. But I don't think ember serve will re-run treeForPublic on subsequent file change in the app.
Is there a way to ignore specific files from file watch? Yet still allow files to include into the build? Maybe there's an exclude watch property in ember-cli-build?
Here's my treeForPublic() , but I'm guessing my problems aren't here:
treeForPublic: function() {
const publicTree = this._super.treeForPublic.apply(this, arguments);
const trees = [];
if (publicTree) {
trees.push(publicTree);
}
// this writes out the json
this.saveSettingsFile(this.pubSettingsFile, this.settings);
trees.push(new Funnel(this.addonPubDataPath, {
include: [this.pubSettingsFileName],
destDir: '/data'
}));
return mergeTrees(trees);
},
UPDATE 05/20/2019
I should probably make a new question at this point...
My goal here is to create an auto-increment build number that updates both on ember build and ember serve. My comments under #real_ates's answer below help explain why. In the end, if I can only use this on build, that's totally ok.
The answer from #real_ate was very helpful and solved the endless loop problem, but it doesn't run on ember serve. Maybe this just can't be done, but I'd really like to know either way. I'm currently trying to change environment variables instead of using treeforPublic(). I've asked that as a separate question about addon config() updates to Ember environment:
Updating Ember.js environment variables do not take effect using in-repo addon config() method on ember serve
I don't know if can mark #real_ate's answer as the accepted solution because it doesn't work on ember serve. It was extremely helpful and educational!
This is a great question, and it's often something that people can be a bit confused about when working with broccoli (I know for sure that I've been stung by this in the past)
The issue that you have is that your treeForPublic() is actually writing a file to the source directory and then you're using broccoli-funnel to select that new custom file and include it in the build. The correct method to do this is instead to use broccoli-file-creator to create an output tree that includes your new file. I'll go into more detail with an example below:
treeForPublic: function() {
const publicTree = this._super.treeForPublic.apply(this, arguments);
const trees = [];
if (publicTree) {
trees.push(publicTree);
}
let data = getSettingsData(this.settings);
trees.push(writeFile('/data/the-settings-file.json', JSON.stringify(data)));
return mergeTrees(trees);
}
As you will see the most of the code is exactly the same as your example. The two main differences are that instead of having a function this.saveSettingsFile() that writes out a settings file on disk we now have a function this.getSettingsData() that returns the content that we would like to see in the newly created file. Here is the simple example that we came up with when we were testing this out:
function getSettingsData() {
return {
setting1: 'face',
setting2: 'my',
}
}
you can edit this function to take whatever parameters you need it to and have whatever functionality you would like.
The next major difference is that we are using the writeFile() function which is actually just the broccoli-file-creator plugin. Here is the import that you would put at the top of the file:
let writeFile = require('broccoli-file-creator');
Now when you run your application it won't be writing to the source directory any more which means it will stop constantly reloading 🎉
This question was answered as part of "May I Ask a Question" Season 2 Episode 2. If you would like to see us discuss this answer in full you can check out the video here: https://youtu.be/9kMGMK9Ur4E
I want to import/require an image that doesn't have an extension. Is this possible? For example currently I can import jsx files without writing the extension. What if I want to do the same for image files or other type of files that lack file extension?
E.g. require('./avatar.png') will work. What I want to work is require('./avatar')
I'd strongly advise against doing this, as writing the extension makes it more explict exactly what's being imported.
For example, if you had avatar.js, avatar.png and avatar.css in the same folder, is it easy to tell what import ... from './avatar' will give you? Having similarly-named files with different extensions is not an uncommon convention.
But, either way, you can add the extensions you want to resolve.extensions in the webpack config, like so. Try to be responsible with it.
module.exports = {
//...
resolve: {
extensions: ['.js', '.jsx', '.png', '.jpg', /* ... */]
}
}
I know this might be a duplicate of this question but there was no clear answer ever.
Polymer 2 Framework has a quite good documentation so far but when it comes to the build process there`s not enough explanation.
I've successfully created my own element, also with external scripts referenced and everything runs fine with
polymer serve --open
But I've spent so much time to get this built and to include the output into a minimal HTML template without success. Is it really that tricky?
I`ve even tried again with the empty element template, no chance. This template has a nearly blank polymer.json:
{
"lint": {
"rules": [
"polymer-2"
]
}
}
If I build that right away with
polymer build
(should use default build behaviour) then I get a default build folder with an index.html and bower_components folder. There`s no reference to my created custom element ("Hello ...").
What do I have to do to get a final build of this "Hello Something" template and include it into a minimum html page?
There are a lot of different ways to go from single component to app with that single component, and I'm not going to say 100% that this is the best, but it should work. "What do I have to do to get a final build of this "Hello Something" template and include it into a minimum html page?", is a pretty flexible request, so even in the below there could be lots of alternatives for you, but the following would be my suggestion. We'll start in the command line, from the Desktop or a folder where you keep you projects.
mkdir minimal-html-page
cd minimal-html-page
polymer init
// here make sure you choose `polymer-2-application` other questions re of little consequence in this specific use case
bower install {yourComponent} --save
// in that case that you haven't published to github, copy and paste also works. Paste into the `src` directory if that's the case.
atom .
// or whatever editor you prefer
Now you're in your project, and there is just one change needed to get you going.
index.html
Change the current HTML import
<link rel="import" href="/src/build-test-app/build-test-app.html">
to link to your component.
At this point you should be free to use polymer build to have the project built, then it'll structure your code to be deployed in other applications via something that will look like
<script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script>
<link rel="import" href="/src/build-test-app/build-test-app.html">
<build-test-app></build-test-app>
This is the most basic of builds and won't account for any x-browser or performance goals you might have in your project. You'll also see in the build/default directory all the files you'd need to copy/paste to use the component elsewhere.
If you do have x-browser expectations, you can solve them fairly easily by using the polymer build --compile command. This will create slightly more complex embed code to manage either side of the ES5/6 capability boundary and will look something like:
<script>!function(e){var r=e.babelHelpers={};r.typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r.classCallCheck=function(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")},r.createClass=function(){function e(e,r){for(var t=0;t<r.length;t++){var n=r[t];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(r,t,n){return t&&e(r.prototype,t),n&&e(r,n),r}}(),r.defineEnumerableProperties=function(e,r){for(var t in r){var n=r[t];n.configurable=n.enumerable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,t,n)}return e},r.defaults=function(e,r){for(var t=Object.getOwnPropertyNames(r),n=0;n<t.length;n++){var o=t[n],i=Object.getOwnPropertyDescriptor(r,o);i&&i.configurable&&void 0===e[o]&&Object.defineProperty(e,o,i)}return e},r.defineProperty=function(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e},r.extends=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},r.get=function e(r,t,n){null===r&&(r=Function.prototype);var o=Object.getOwnPropertyDescriptor(r,t);if(void 0===o){var i=Object.getPrototypeOf(r);return null===i?void 0:e(i,t,n)}if("value"in o)return o.value;var a=o.get;if(void 0!==a)return a.call(n)},r.inherits=function(e,r){if("function"!=typeof r&&null!==r)throw new TypeError("Super expression must either be null or a function, not "+typeof r);e.prototype=Object.create(r&&r.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),r&&(Object.setPrototypeOf?Object.setPrototypeOf(e,r):e.__proto__=r)},r.instanceof=function(e,r){return null!=r&&"undefined"!=typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](e):e instanceof r},r.newArrowCheck=function(e,r){if(e!==r)throw new TypeError("Cannot instantiate an arrow function")},r.objectDestructuringEmpty=function(e){if(null==e)throw new TypeError("Cannot destructure undefined")},r.objectWithoutProperties=function(e,r){var t={};for(var n in e)r.indexOf(n)>=0||Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},r.possibleConstructorReturn=function(e,r){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!r||"object"!=typeof r&&"function"!=typeof r?e:r},r.set=function e(r,t,n,o){var i=Object.getOwnPropertyDescriptor(r,t);if(void 0===i){var a=Object.getPrototypeOf(r);null!==a&&e(a,t,n,o)}else if("value"in i&&i.writable)i.value=n;else{var u=i.set;void 0!==u&&u.call(o,n)}return n},r.slicedToArray=function(){function e(e,r){var t=[],n=!0,o=!1,i=void 0;try{for(var a,u=e[Symbol.iterator]();!(n=(a=u.next()).done)&&(t.push(a.value),!r||t.length!==r);n=!0);}catch(e){o=!0,i=e}finally{try{!n&&u.return&&u.return()}finally{if(o)throw i}}return t}return function(r,t){if(Array.isArray(r))return r;if(Symbol.iterator in Object(r))return e(r,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),r.taggedTemplateLiteral=function(e,r){return Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(r)}}))},r.temporalRef=function(e,r,t){if(e===t)throw new ReferenceError(r+" is not defined - temporal dead zone");return e},r.temporalUndefined={},r.toArray=function(e){return Array.isArray(e)?e:Array.from(e)},r.toConsumableArray=function(e){if(Array.isArray(e)){for(var r=0,t=Array(e.length);r<e.length;r++)t[r]=e[r];return t}return Array.from(e)}}("undefined"==typeof global?self:global);</script>
<script>if (!window.customElements) { document.write('<!--'); }</script>
<script type="text/javascript" src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
<!--! do not remove -->
<script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script>
<link rel="import" href="/src/build-test-app/build-test-app.html">
<build-test-app></build-test-app>
The <!--! do not remove --> part is super not kidding and it integral to making sure the compiled code works in ES6 environments.
Beyond that, there is a whole world of things that you can do to tune this up for production deployment. I'd research https://www.polymer-project.org/2.0/docs/tools/polymer-cli-commands#build and https://www.polymer-project.org/2.0/docs/tools/polymer-json to get a better handle on that.
Re polymer build "This command is for app projects only." (https://www.polymer-project.org/2.0/docs/tools/polymer-cli-commands#build)
Also, shell is required. See https://www.polymer-project.org/2.0/docs/tools/polymer-json#shell.
I'm attempting to change the maximum row width from 1200px to 1560px however I'm having trouble finding anyway to do this. I'm using SASS to compile.
I'm assuming that settings just need to be changed in the settings.scss file however any changes I make seem to have no effect on row width.
I saw a breakpoints variable here
$breakpoints: (
small: 0,
medium: 1200px,
large: 1560px,
xlarge: 1440px,
xxlarge: 1440px,
);
There I changed large: from 1200px to 1560px and changed the other breakpoints as well.
I also changed the $global-width here
$global-width: rem-calc(1560);
None of these seemed to have had any effect. I made sure it was included in my main.scss file.
#import "vendors/foundation/settings";
#import "base/colors";
#import "base/global";
#import "base/typography";
My folder structure is
-_main.scss
-base
-_colors.scss
-_global.scss
-_typography.scss
-vendors
-foundation
-_settings.scss
Also I double checked and the effects of all the other scss files are working just fine. I'm getting no errors.
UPDATE: I also made sure that the settings import happened after my base foundation includes
#import '../bower_components/foundation-sites/scss/util/util';
#import '../bower_components/foundation-sites/scss/foundation.scss';
#include foundation-global-styles;
#include foundation-grid;
All occur before the rest of my imports.
How do you change the max width or rows/breakpoints in SASS in Foundation 6
UPDATE: I also added a test variable
$testcolor: #523432;
and used it elsewhere in base/colors like so
* { border: 1px solid $testcolor;}
And that works just fine.
Turns out it had to do with the order I imported. The _settings.scss file needs to be imported before the base _foundation.scss file.