The documentation for gitbook says the following:
Once you find a plugin that you want to install, you need to add it to your book.json:
{
"plugins": ["myPlugin", "anotherPlugin"]
}
You can also specify a specific version using: "myPlugin#0.3.1". By default GitBook will resolve the latest version of the plugin compatible with the current GitBook version.
However, I do not know where this file is (book.json)?
I can see no links to even add a file called this in the edit section or settings section. Please can someone explain to me how I get a plugin installed on my GitBooks, for example the Adsense plugin.
I want to know, how to get this installed and also how to add the code to display the add on the page.
Thank you
Switch to FILES at the top of the left sidebar and then right click to create book.json.
You can try to use the full GitHub url with version:
{
"plugins": [
"myplugin#git+https://github.com/MyCompany/mygitbookplugin.git#1.0.0"
]
}
https://toolchain.gitbook.com/plugins/create.html
Related
I tried so but I have a 'require is not defined' error. I can't find information about that, can someone enlighten the noob in me please?
It's possible, but you have to be careful. Trying to require() a package means that node will try to locate its files in your file system. A chrome extension only has access to the files you declare in the manifest, not your filesystem.
To get around this, use a module bundler like Webpack, which will generate a single javascript file containing all code for all packages included through require(). You will have to generate a separate module for each component of your chrome extension (e.g. one for the background page, one for content scripts, one for the popup) and declare each generated module in your manifest.
To avoid trying to setup your build system to make using require() possible, I suggest starting with a boilerplate project. You can check out my extension to see how I do it.
An updated answer for 2022
Short answer: yes, you can require/import packages. Rather than going through the tedious work of setting up & configuring a bundler like Webpack on your own (especially if you have no experience with them), there are now build tools you can use to create the boilerplate "scaffolding" for a Chrome extension:
Extension CLI -- this one is well-documented and you can also reference the source code of some Chrome extensions that have used this tool (READ: learn how others have set up their code).
Chrome Extension CLI
Benefits of using them:
New projects are initiated with a default project file structure. Super helpful.
They support modern Javascript (ES6, ES2021), so modules work fine.
They already have bundlers integrated and pre-configured (Webpack in both above cases I think). You therefore don't need to install and configure any on your own.
You can use npm as normal to install any packages/dependencies you need.
Then of course, let the official documentation for Chrome Extensions guide you through the rest.
It's not possible to require node modules directly within a chrome extension. However, it is possible to bundle node applications and packages into the browser for use with your extensions. See here for more: Is it possible to develop Google Chrome extensions using node.js?
Yes, It is possible with esm npm packages.
require is commonjs module loader.
Browser doesn't support commonjs modules system
so that this error showed.
Method 1:
Run npm init -y and add "type" :"module" in your package.json.
create path.js file
add this line in path.js
const fullPath = await import.meta.resolve("npm-pkg-name");
const path = fullPath?.match(/(/node_modules.*)/)[0];
console.log(path);
add this line inside package.json
"path": "node --experimental-import-meta-resolve path.js",
Copy console output text. Replace package name with this copied path.
Method 2:
Install other npm package to find and replace
npm packages' virtual path to real path so that chrome browser will find it.
Install Path-fixxer
Add this line in path.js
import setAllPkgPath from "path-fixxer";
setAllPkgPath();
then run command : npm run path.
Now open browser to test it.
As you know, app package name (**com.****.******) is very important thing in Flutter app, it is also being used in app's link on Play Store, and some other places.
So, I have a app package name which is automatically created by flutter when creating app via command line: com.example.app
How can I change it properly? There are lots of files and folders named after the app package name, so changing app package name manually without causing error is something I seek.
You need to change it in
android/app/build.gradle
android/app/src/main/kotlin/com/example/personal_web/MainActivity.kt
android/app/src/main/AndroidManifest.xml
There's a useful package for changing it but it works well with android, I didn't try for IOS.
Firstly install the package:
change_app_package_name: ^1.0.0
Then in terminal in your project paths do these commands:
flutter pub get
Then write the line below and use the unique name you want after com. then press enter:
flutter pub run change_app_package_name:main com.myuniquename.flutter_app
it will update files and delete old package name.
You need to change it in the following files.
android/app/build.gradle
android/app/src/main/kotlin/com/example/personal_web/MainActivity.kt
android/app/src/main/AndroidManifest.xml
android/app/src/main/profile/AndroidManifest.xml
android/app/src/debug/AndroidManifest.xml
From the documentation:
Your application ID is defined with the applicationId property in your
module's build.gradle file [...]
Flutter: Open /android/app/build.gradle, scroll down to applicationId.
The most appropriate command would be flutter create --org com.changehere -a kotlin -i swift yourapp_name
I am trying to use CKEditor for strapi project, but failing to integrate.
What I did so far:
strapi new cms --quickstart It is starting me new cms application.
npm install ckeditor
Edit the code located at ./plugins/content-manager/admin/src/component/Edit/index.js to CKEditor implementation
npm run build to see my changes, tried npm run setup too
But here I'm getting error webpackJsonp is not defined
I'm not providing the code how I modified, because, build command is not reaching till there.
I appreciate any help you can provide
In order to change the default WYSIWYG in Strapi you will need to
Fork the repository check out the CONTRIBUTING GUIDE
Once you have the development setup you can directly modify the code in packages/strapi-plugin-content-manager/admin/src/components/WYSIWYGWithErrors and its related children. Install the dependency in strapi-admin
Uninstall the content manager plugin (again make sure you are running the latest version of Strapi
Copy the strapi-plugin-content-manager package inside your app's plugin folder (rename it content-manager)
Copy the following file in my-app/admin/src/plugins.js and change the paths of the plugins so it matches your new one
run yarn develop
I tried so but I have a 'require is not defined' error. I can't find information about that, can someone enlighten the noob in me please?
It's possible, but you have to be careful. Trying to require() a package means that node will try to locate its files in your file system. A chrome extension only has access to the files you declare in the manifest, not your filesystem.
To get around this, use a module bundler like Webpack, which will generate a single javascript file containing all code for all packages included through require(). You will have to generate a separate module for each component of your chrome extension (e.g. one for the background page, one for content scripts, one for the popup) and declare each generated module in your manifest.
To avoid trying to setup your build system to make using require() possible, I suggest starting with a boilerplate project. You can check out my extension to see how I do it.
An updated answer for 2022
Short answer: yes, you can require/import packages. Rather than going through the tedious work of setting up & configuring a bundler like Webpack on your own (especially if you have no experience with them), there are now build tools you can use to create the boilerplate "scaffolding" for a Chrome extension:
Extension CLI -- this one is well-documented and you can also reference the source code of some Chrome extensions that have used this tool (READ: learn how others have set up their code).
Chrome Extension CLI
Benefits of using them:
New projects are initiated with a default project file structure. Super helpful.
They support modern Javascript (ES6, ES2021), so modules work fine.
They already have bundlers integrated and pre-configured (Webpack in both above cases I think). You therefore don't need to install and configure any on your own.
You can use npm as normal to install any packages/dependencies you need.
Then of course, let the official documentation for Chrome Extensions guide you through the rest.
It's not possible to require node modules directly within a chrome extension. However, it is possible to bundle node applications and packages into the browser for use with your extensions. See here for more: Is it possible to develop Google Chrome extensions using node.js?
Yes, It is possible with esm npm packages.
require is commonjs module loader.
Browser doesn't support commonjs modules system
so that this error showed.
Method 1:
Run npm init -y and add "type" :"module" in your package.json.
create path.js file
add this line in path.js
const fullPath = await import.meta.resolve("npm-pkg-name");
const path = fullPath?.match(/(/node_modules.*)/)[0];
console.log(path);
add this line inside package.json
"path": "node --experimental-import-meta-resolve path.js",
Copy console output text. Replace package name with this copied path.
Method 2:
Install other npm package to find and replace
npm packages' virtual path to real path so that chrome browser will find it.
Install Path-fixxer
Add this line in path.js
import setAllPkgPath from "path-fixxer";
setAllPkgPath();
then run command : npm run path.
Now open browser to test it.
I'm trying to figure out how to reconcile some Cordova + git "best practices" with what I think is reality, and I'm hoping someone can shed some light on this for me.
If I understand correctly, the current "best practice" is to add these directories to my .gitignore (from the book "Developing with Cordova CLI", the current version):
platforms/
plugins/
node_modules/
This removes the easily downloadable plugins and mostly boilerplate platform code from version control because it can be easily generated with a simple Cordova CLI command.
But, this seems counter-intuitive because - and I'm thinking like NPM or Bower - with the Cordova CLI I can't save which platforms and plugins I'm using in a config file. With NPM, I can add a --save switch to save the package in the package.json file. This allows me to not version control my node_modules folder and instead use 'npm install'. With the Cordova CLI I can't seem to use the --save switch (is there an equivalent) to 'remember' the plugins or platforms I intend to use.
It seems that the config.xml file in the www/ directory doesn't save which platforms or plugins have been added.
Is there some other file in the project that keeps a memory of which platforms and plugins I want to use? How does it work?
Cordova 4.3.0 + allows you to save and restore platforms and plugins. Saved information is stored in config.xml file. See v5.0.0 release notes and the official Cordova docs.
You can save platforms and plugins using the --save option when you add them:
cordova platforms add PLATFORM --save
cordova plugins add PLUGIN --save
Or you can save platforms and plugins that are currently added:
cordova platforms save
cordova plugins save
By doing this there is no need to check in platforms or plugins into your code repository. They will be automatically restored based on your config.xml file when cordova prepare command is run.
I typically write a hook to capture the plugins I want to use in my project. You can see this in an article I wrote here: http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/
With the new modular architecture of Cordova 3.x, every app needs plugins, even to use basic functionality such as logging or geolocation. Rather than document which plugins/features your project needs and ask each new developer to install them, download and install them automatically with a hook in the after_platform_add step. Using this plugin, every time a developer checks out the project and adds a platform, they automatically have the required plugins.
You also may be interested in following along with this bug, which suggests npm style --save functionality: https://issues.apache.org/jira/browse/CB-5775
Platforms are a little more difficult because they don't fit into the hook architecture, but you could write a shell script which you could execute to add your platforms.
#!/bin/sh
for plat in ios android; do
cordova platform add $plat
done
You could do something similar with the version of cordova you have installed in node_modules (at least that is what I think you are installing in node_modules)--have shell script to get the correct version of cordova:
#!/bin/sh
VERSION=3.3.1-0.4.2
npm install cordova#$VERSION
PS Glad you liked the book!