自己公司怎么做网站,百度电脑版,上海新建设建筑设计有限公司网站,山西推广公司一、node.js
#xff08;一#xff09;、下载
下载地址
Node.js — 在任何地方运行 JavaScript (nodejs.org)
参考文章#xff1a;Node.js安装及环境配置超详细教程【Windows系统】_windows 安装nodejs-CSDN博客
#xff08;二#xff09;、安装
安装路径可以更换一、下载
下载地址
Node.js — 在任何地方运行 JavaScript (nodejs.org)
参考文章Node.js安装及环境配置超详细教程【Windows系统】_windows 安装nodejs-CSDN博客
二、安装
安装路径可以更换其他都是默认下一步。
第一步增加系统变量
1新建变量NODE_HOME变量值为安装路径E:\Program Files\nodejs
2 PATH 变量增加,需要先新建node_global和node_cache在E:\Program Files\nodejs路径下面。
%NODE_HOME%
%NODE_HOME%\node_global
%NODE_HOME%\node_cache
第二步增加用户变量
E:\Program Files\nodejs\node_global 检查安装情况 node -v npm - v C:\Windows\system32npm -v
10.8.1C:\Windows\system32node -v
v20.16.0配置缓存目录和全局目录 缓存目录 npm config set cache “E:\Program Files\nodejs\node_cache” 全局目录** npm config set prefix “E:\Program Files\nodejs\node_global” (参考文档这边不对的) 设置成功可以看到这边是我自己的路径 C:\Windows\system32npm config get prefix
D:\it\node20\node_globalC:\Windows\system32npm config get cache
D:\it\node20\node_cache设置国内源配置参考文档的镜像源已经不可用
# 设置国内源
npm config set registry https://registry.npmmirror.com
# 查看国内源
npm get registry如果不行在换一个
npm config set registry http://registry.npmjs.org/
删除npm config delete registry 使用pnmp方式安装 第一步设置国内源npm config set registry https://registry.npmmirror.com (我是这个镜像可以安装pnmp) 第二步安装pnmp: npm install pnpm -g
二、Express express使用 存储变量需要配置好不然会报错的
D:\it\node20\node_cache\node_modulesexpress --version ‘express’ 不是内部或外部命令也不是可运行的程序 安装方式(需要使用管理员权限) npm install express -g npm install express-generator -g 移除是 npm uninstall express -g npm uninstall express-generator -g 部分资料没有这个 express-generator 是没有办法使用的 你将无法使用 express 命令来创建新的 Express 应用因为 express 命令实际上是 express-generator 提供的。 安装成功
D:\it\node20\node_cache\node_modulesexpress --version
4.16.1express启动
express express_example
destination is not empty, continue? [y/N] y
cd express_example
npm install
# windows 命令行
set DEBUGmyapp:* npm startexpress-example0.0.0 startnode ./bin/wwwGET / 200 1734.181 ms - 170
GET /stylesheets/style.css 200 3.004 ms - 111
GET /favicon.ico 404 8.515 ms - 1172成功后浏览器打开 http://localhost:3000/ 一个应用就启动了。还是很方便的。
参考Express 应用程序生成器 - Express中文文档 | Express中文网 (expressjs.com.cn)
5. express 关闭
Ctrl C
终止批处理操作吗(Y/N)? Y
三、vue.js
(一)、vue安装
npm install vue -g
npm install vue-cli -g
D:\itvue -V
2.9.6四、Electron记事板开发
(一)、初始化项目
创建一个新的项目目录并初始化
mkdir electron-notepad
cd electron-notepad
npm init -y(二)、安装Electron
安装Electron作为项目的依赖,时间很长。我花了10多分钟。
pnpm install electron --save-dev成功输出
Packages: 75Progress: resolved 75, reused 0, downloaded 75, added 75, done
node_modules/.pnpm/electron31.3.1/node_modules/electron: Running postinstall script, done in 10m 19.2sdevDependencies:electron 31.3.1(三)、创建主进程文件
在项目根目录下创建main.js
const { app, BrowserWindow } require(electron);function createWindow () {// 创建浏览器窗口let win new BrowserWindow({width: 800,height: 600,webPreferences: {nodeIntegration: true}});// 加载index.html文件win.loadFile(index.html);
}app.on(ready, createWindow);在项目根目录下创建index.html这将是记事本的界面
!DOCTYPE html
html
headtitleElectron Notepad/title
/head
bodytextarea idnotepad stylewidth: 100%; height: 90%;/textareabrbutton onclicksave()保存/buttonbutton onclickload()打开/buttonscriptconst { ipcRenderer } require(electron);function save() {let text document.getElementById(notepad).value;ipcRenderer.send(save-text, text);}function load() {ipcRenderer.send(load-text);}ipcRenderer.on(received-text, (event, text) {document.getElementById(notepad).value text;});/script
/body
/html在main.js中添加IPC通信以便在Electron的主进程和渲染进程之间传递数据
const { ipcMain } require(electron);ipcMain.on(save-text, (event, text) {// 这里可以添加保存文件的逻辑console.log(Text saved:, text);
});ipcMain.on(load-text, (event) {// 这里可以添加加载文件的逻辑event.reply(received-text, This is loaded text.);
});(四)、编译安装包
安装electron-builder
pnpm install electron-builder --save-dev在package.json中添加构建脚本
scripts: {start: electron .,dist: electron-builder
}main改为main.js
main: main.js,运行构建命令
Windows :pnpm run dist --win
macos:pnpm run dist --mac
Linux:pnpm run dist --linux
失败了如果github访问没有问题不会存在以下错误。(成功不需要看) electron-notepad1.0.0 dist D:\it\electron-notepadelectron-builder --win• electron-builder version24.13.3 os10.0.19045• description is missed in the package.json appPackageFileD:\it\electron-notepad\package.json• writing effective config filedist\builder-effective-config.yaml• packaging platformwin32 archx64 electron31.3.1 appOutDirdist\win-unpacked⨯ Get https://github.com/electron/electron/releases/download/v31.3.1/electron-v31.3.1-win32-x64.zip: EOF
github.com/develar/app-builder/pkg/download.(*Downloader).follow.func1/Volumes/data/Documents/app-builder/pkg/download/downloader.go:206
github.com/develar/app-builder/pkg/download.(*Downloader).follow/Volumes/data/Documents/app-builder/pkg/download/downloader.go:234
github.com/develar/app-builder/pkg/download.(*Downloader).DownloadNoRetry/Volumes/data/Documents/app-builder/pkg/download/downloader.go:128
github.com/develar/app-builder/pkg/download.(*Downloader).Download/Volumes/data/Documents/app-builder/pkg/download/downloader.go:112
github.com/develar/app-builder/pkg/electron.(*ElectronDownloader).doDownload/Volumes/data/Documents/app-builder/pkg/electron/electronDownloader.go:192
github.com/develar/app-builder/pkg/electron.(*ElectronDownloader).Download/Volumes/data/Documents/app-builder/pkg/electron/electronDownloader.go:177
github.com/develar/app-builder/pkg/electron.downloadElectron.func1.1/Volumes/data/Documents/app-builder/pkg/electron/electronDownloader.go:73
github.com/develar/app-builder/pkg/util.MapAsyncConcurrency.func2/Volumes/data/Documents/app-builder/pkg/util/async.go:68
runtime.goexit/usr/local/Cellar/go/1.17/libexec/src/runtime/asm_amd64.s:1581⨯ D:\it\electron-notepad\node_modules\.pnpm\app-builder-bin4.0.0\node_modules\app-builder-bin\win\x64\app-builder.exe process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1 failedTaskbuild stackTraceError: D:\it\electron-notepad\node_modules\.pnpm\app-builder-bin4.0.0\node_modules\app-builder-bin\win\x64\app-builder.exe process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1at ChildProcess.anonymous (D:\it\electron-notepad\node_modules\.pnpm\builder-util24.13.1\node_modules\builder-util\src\util.ts:252:14)at Object.onceWrapper (node:events:634:26)at ChildProcess.emit (node:events:519:28)at ChildProcess.cp.emit (D:\it\electron-notepad\node_modules\.pnpm\cross-spawn7.0.3\node_modules\cross-spawn\lib\enoent.js:34:29)at maybeClose (node:internal/child_process:1105:16)at Process.ChildProcess._handle.onexit (node:internal/child_process:305:5)ELIFECYCLE Command failed with exit code 1.手动下载 迅雷下载 https://github.com/electron/electron/releases/download/v31.3.1/electron-v31.3.1-win32-x64.zip 下载后放到electron-notepad\node_modules\electron 目录下解压electron-v31.3.1-win32-x64.zip。 electron-notepad\node_modules\electron 目录下创建path.txt文件增加文件内容为electron.exe。 重写执行pnpm run dist --win 成功的输出 electron-notepad1.0.0 dist D:\it\electron-notepadelectron-builder --win• electron-builder version24.13.3 os10.0.19045• description is missed in the package.json appPackageFileD:\it\electron-notepad\package.json• writing effective config filedist\builder-effective-config.yaml• packaging platformwin32 archx64 electron31.3.1 appOutDirdist\win-unpacked• default Electron icon is used reasonapplication icon is not set• downloading urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/winCodeSign-2.6.0/winCodeSign-2.6.0.7z size5.6 MB parts1• downloaded urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/winCodeSign-2.6.0/winCodeSign-2.6.0.7z duration1m0.46s• building targetnsis filedist\electron-notepad Setup 1.0.0.exe archsx64 oneClicktrue perMachinefalse• downloading urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/nsis-3.0.4.1/nsis-3.0.4.1.7z size1.3 MB parts1• downloaded urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/nsis-3.0.4.1/nsis-3.0.4.1.7z duration2.685s• downloading urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/nsis-resources-3.4.1/nsis-resources-3.4.1.7z size731 kB parts1• downloaded urlhttps://github.com/electron-userland/electron-builder-binaries/releases/download/nsis-resources-3.4.1/nsis-resources-3.4.1.7z duration6.816s• building block map blockMapFiledist\electron-notepad Setup 1.0.0.exe.blockmap可执行文件运行 electron-notepad\dist\electron-notepad Setup 1.0.0.exe 双击一键安装
