I am learning spfx webpart. I open the gulpfile.js file but it only has limited code lines. how can I know the procedure of building spfx webpart?
And I notice that there is a PNP spfx generator. is it possible to create my own custom spfx generator? or involve spfx into my node project?
thanks
SPFx projects are built using a complex Build System that is an npm package. You can find it under node_modules folder under the name - #microsoft/sp-build-web
This package makes use of more packages. You can go into the node_moduels folder and look for packages named #microsoft/gulp-core-build*
The entire build system is built in Object oriented code with lots of classes and interfaces using TypeScript.
If you want to just customize the Build process then you can build custom tasks which are coded in the gulpfile.js.
On good article to learn is at - https://rencore.com/blog/extending-sharepoint-framework-build-process-custom-tasks/
Related
I developing addin for outlook and i using officejs framework and Yeoman Generator. I use SmartAlerts because with ItemSend event i can't deploy my plugin into Appsource. I have a problem: i would like to call/import my modules from typescript files into launchevent.js, a file to use for event "OnMessageSend". I see on documentation that is not possible.
I tried to create a new bundle but it work only if into file there is a import istruction and in this file i can't use it. How can i do?
Thanks
You may create a new add-in skeleton in TypeScript where you can import the required modules to the event handler's module. The TS compiler will produce the required JS files in the output folder. Webpack links code chunks with web pages. But that is not great idea to mix JS and TS files in the same solution. Use one or another programming language for your solutions. I prefer using TypeScript.
We're developing a VS Code extensions web plugin using Typescript. We already have a company provided component, which is downloaded in the node_modules folder. But when I'm referring those modules, the application does not start:
How can I use those components in my plugin extension.
From the web view standpoint, there's no Node.js, no VS Code, node_modules or anything you have in the extension you are writing. The content of the web view must be fully self contained. You have to use a bundler (like webpack) to create JS bundles of your application you want to show in the web view, which includes all the source code of the referenced 3rd party libraries.
I need to create a reusable Xamarin Forms control that will be used in two separate projects. It does require custom renderers for IOS and Android. The problem is I cannot figure our what kind of project to use to create a reusable custom control library for Xamarin forms.
Every site seems to talk about creating customer controls that can be reusing in the same project. But I need it in a separate project for reuse.
Can someone please point me in the right direction.
Depending what are your needs regarding multi-targeting, using a solution with a shared project of type MSBuild.Sdk.Extras could be very helpful. You can then packed your shared project into a package that you can reference from your apps project and use locally.
Examples that might guide you and shows you the path are known nuget packages that are being used by app developers cross-platforms, just an example Xamarin.Forms.PancakeView.
Related to MSBuild.Sdk.Extras: How to use different base class in custom control depending on platform target?
I'm trying to migrate an Angular app to a shared codebase with Nativescript using the new #nativescript/schematics, however, I'm having problems importing my Angular library when building the mobile version of the app. I used the angular-cli to create the library (ng generate library).
For the web version, all I had to do was build the library separately using ng build library-name which then allowed me to import it into the main application.
How can I build a mobile version of the library that can be imported into the main application when running tns run ios --bundle? I've already migrated the components and module of the library with appropriate *.tns files.
Any help is appreciated
I had the same problem. Nativescript cli do not have this feature where we can build an angular library into npm package and use it in other projects.
I tried a workaround and it worked for me. Write a script to copy all of your project files into another directory and replace all *.tns.ts, *tns.html and *.tns.scss. files with *.ts, *.html and *.scss respectively. Then build these files using regular ng command. You can add a build configuration for the same in angular.json file to build from the copied directory. I hope it helps.
I'm sorry this is just a hyperlink answer but the space required to answer this, in my opinion, is way too large. I just finished finalizing a repo I've been working on to do exactly this. I have a whole slew of angular web libraries that I now want to make available for use on mobile using NativeScript. I have put everything I have learned so far into this repo and I hope it helps you too.
Thanks for the final push/idea #Rohit, a script for doing what he suggests is in the test-lib/gulpfile.js of this repo.
I'm working with in a Sencha Touch app project. Currently we are using sencha-touch-all.js. But it's size is too big. Are there any procedure to make one custom sencha-touch.js with only required modules.
Thanks in advance.
Mitchell Simoens says:
You can use sencha-touch-debug.js for development and if you are using MVC then you can do a build that will include only the ST classes and your application classes making it only what you need.
Source
Use the sencha cmd to generate the app, then compile with sencha app build package|production. CMD will create a bundle app.js which includes only the required clases for your app.