autojs的nodejs打包成品app經(jīng)驗(yàn)分享
用nodejs寫腳本, 下面這九步你都要做
第一: vscode安裝插件 ESLint
為什么要安裝eslint?
因?yàn)?eslint 可以幫助你找到代碼中的各種bug, 尤其是像autojs這種寫腳本的, java和nodejs混合寫的代碼,
指不定那個(gè)類沒有寫全類名, 只寫了類名, 打包以后就會(huì)報(bào)錯(cuò), 或者閃退
安裝eslint依賴
npm i -D babel-loader @babel/core @babel/preset-env
根目錄增加 eslint 配置文件 .eslintrc.json , 看清楚, 文件名最前面有英文句號(hào)
{
"env": {
"browser": true,
"commonjs": true,
"es2021": true,
"node": true
},
"extends": "eslint:recommended",
"overrides": [],
"parserOptions": {
"ecmaVersion": "latest"
},
"globals": {
"android": "readonly",
"com": "readonly",
"$autojs": "readonly",
"androidx": "readonly"
}
}
根目錄增加 eslint 忽略檢查某些文件, 文件名是: .eslintignore
dist/bundle.js
第二: 使用 babel 把es6轉(zhuǎn)成es5
webpack.config.js 增加 babel 配置
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
},
},
},
],
},
根目錄增加文件 .babelrc, 看清楚, 前面有點(diǎn)號(hào)
{
"presets": ["@babel/preset-env"]
}
第三 可以復(fù)制我的 webpack 配置文件
webpack.config.js
const webpack = require("webpack");
const TerserWebpackPlugin = require("terser-webpack-plugin");
module.exports = {
mode: "production",
entry: "./main.js",
output: {
filename: "bundle.js",
},
target: "node",
externals: {
ui: "commonjs ui",
rhino: "commonjs rhino",
lang: "commonjs lang",
toast: "commonjs toast",
datastore: "commonjs datastore",
axios: "commonjs axios",
app: "commonjs app",
color: "commonjs color",
image: "commonjs image",
device: "commonjs device",
clip_manager: "commonjs clip_manager",
},
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
},
},
},
],
},
plugins: [
new webpack.DefinePlugin({
android: "android",
java: "java",
$java: "$java",
$autojs: "$autojs",
}),
],
optimization: {
minimize: true,
minimizer: [
new TerserWebpackPlugin({
extractComments: false,
test: /.js(?.*)?$/i,
terserOptions: {
output: {
preamble: '"nodejs ui";',
},
toplevel: true,
mangle: false,
},
}),
],
},
};
在 optimization 這個(gè)字段中, 有一個(gè) mangle 是用來控制壓縮變量的名字的, 就是把長長的變量名, 改成短短的變量名; 設(shè)置為 true 才會(huì)有效果;
我設(shè)置的是false, 因?yàn)樵O(shè)置為 true 的話, 我用 defineClass 定義的控件類就找不到了
await $java.defineClass(NoScrollViewPager, { packageName: "org.yashu" });
如果你沒有定義控件類的話, 建議設(shè)置為true
還有一個(gè)字段是
preamble: '"nodejs ui";',
這個(gè)字段的作用是, 在bundle.js的文件頭第一行, 添加 nodejs ui;
第四: package.json 增加 build 命令
"scripts": {
"build": "webpack --config webpack.config.js"
},
如果你沒裝 webpack, 那就先安裝 webpack
npm install webpack webpack-cli --save-dev
用webpack打包腳本, 就在命令行執(zhí)行
npm run build
生成的代碼就在
dist/bundle.js
第五: 保存bundle.js到手機(jī)
如果只有這一個(gè)文件的話, 直接按 F1, 輸入autojs, 選擇保存當(dāng)前文件, 打包的時(shí)候就打包單文件;
如果你還有其他依賴, 比如圖片, 那么你就要新建一個(gè)項(xiàng)目,
把圖片和bundle.js都復(fù)制一份過去, 然后按 F1, 輸入autojs, 選擇保存項(xiàng)目, 打包的時(shí)候就打包這個(gè)新建的項(xiàng)目.
為什么不打包寫代碼的那個(gè)項(xiàng)目呢?
因?yàn)槲掖虬偸鞘? 不是這里錯(cuò), 就是那里錯(cuò).
第六: 打包成app測(cè)試
如果打包之后, 直接閃退怎么辦?
你可以給代碼中, 添加更多的日志, 然后保存到文件, 報(bào)錯(cuò)了就去查日志;
我是不想寫很多日志的, 因此我采用的方法是, 專門打包一個(gè)app用來測(cè)試, 點(diǎn)擊按鈕之后, 就運(yùn)行bundle.js
ui.執(zhí)行項(xiàng)目nodejs.click(function () {
let filePath = ui.項(xiàng)目入口文件路徑nodejs.text().trim();
let workingDirectory = getParentPath(filePath);
console.log("workingDirectory =");
console.log(workingDirectory);
const execution = $engines.execScriptFile(filePath, {
arguments: {
serverEngineId: $engines.myEngine().id,
},
workingDirectory: workingDirectory
});
nodejsExecutions.push(execution);
});
如果你的 bundle.js 有別的依賴的話, 注意打印看看工作路徑是否和你預(yù)期的一致:
在bundle.js開頭添加這行代碼, 查看 Node.js 進(jìn)程的當(dāng)前工作目錄
consle.log(process.cwd());
這樣就算bundle.js崩潰了, 我打包的那個(gè)app是不會(huì)崩潰的, 還可以正常查看日志.
第七: project.json
按 F5 運(yùn)行的腳本是由 main 字段決定的, 因此我們會(huì)修改main字段
"main": "main.js", "main": "dist/bundle.js",
可以增加 type 字段, 那么代碼默認(rèn)用 nodejs 執(zhí)行
"type": "node"
第八: 三個(gè)文件
- .autojs.build.ignore 打包的時(shí)候, 不打包它里面匹配的文件
- .autojs.source.ignore 它匹配的文件, 不參與加密過程
- .autojs.sync.ignore 同步的時(shí)候, 不給手機(jī)傳它匹配的文件
第九: 試試autojs的nodejs寫的app
用webpack壓縮后的腳本大小是 423 KB,
打包app的時(shí)候, 我選擇的 CPU 架構(gòu)是 arm64-v8a, 也許有的舊手機(jī)不能使用, 舊手機(jī) v7 居多.
app下載體驗(yàn): ChatGPT安卓版
app功能
- AI 聊天
- AI 根據(jù)文件生成圖片
- AI 修改圖片內(nèi)容
名人名言
思路是最重要的, 其他的百度, bing, stackoverflow, github, 安卓文檔, autojs文檔, 最后才是群里問問 ---
以上就是autojs的nodejs打包成品app經(jīng)驗(yàn)分享的詳細(xì)內(nèi)容，更多關(guān)于autojs nodejs打包成app的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要給大家介紹了關(guān)于NodeJs入門教程之定時(shí)器和隊(duì)列的相關(guān)資料，文中通過示例代碼以及圖文介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
這篇文章主要介紹了Node.js中的流（Stream）介紹,本文講解了什么是流、pipe方法、流的分類、Readable流狀態(tài)的切換等內(nèi)容,需要的朋友可以參考下2015-03-03
這篇文章主要介紹了一些可能會(huì)用到的Node.js面試題，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，,需要的朋友可以參考下2019-06-06
node.JS事件機(jī)制與events事件模塊的使用方法詳解
本文將詳細(xì)介紹nodeJS事件機(jī)制與events事件模塊的使用方2020-02-02
win7下安裝配置node.js+express開發(fā)環(huán)境
windows7下安裝nodejs及框架express,從誕生至今一直被熱捧,筆者最近也裝了個(gè)環(huán)境打算了解一下。安裝步驟簡單比較簡單,這里分享給大家，希望大家能夠喜歡。2015-12-12
按照常理，我們渲染一張網(wǎng)頁，必定是網(wǎng)頁全部拼裝完畢，然后生成HTML字符串，傳送至客戶端。這也意味著，如果一張網(wǎng)頁處理的有快有慢的話，必須串行等到所有的邏輯都處理完畢。后端才能進(jìn)行返回。2016-09-09
nodejs對(duì)項(xiàng)目下所有空文件夾創(chuàng)建gitkeep的方法
這篇文章主要介紹了nodejs對(duì)項(xiàng)目下所有空文件夾創(chuàng)建gitkeep的方法，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
Nodejs讀取本地json文件,輸出json數(shù)據(jù)接口方式
這篇文章主要介紹了Nodejs讀取本地json文件,輸出json數(shù)據(jù)接口方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了玩轉(zhuǎn)Koa之核心原理分析，本文從封裝創(chuàng)建應(yīng)用程序函數(shù)、擴(kuò)展res和req、中間件實(shí)現(xiàn)原理、異常處理的等這幾個(gè)方面來介紹，感興趣的可以了解一下2018-12-12
詳解Node中導(dǎo)入模塊require和import的區(qū)別
本篇文章主要介紹了詳解Node中導(dǎo)入模塊require和import的區(qū)別，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下。2017-08-08