美文网首页
用nw.js构建node项目

用nw.js构建node项目

作者: 龙黎_ | 来源:发表于2017-11-07 00:08 被阅读468次

在网上找了很多nw.js快速开始的教程,很大一部分都是通过最基本的index.html和package.json来访问“hello world”页面。这里我简单得介绍下在“hello world”基础上更进一步的过程。

(1)下载nw.js

登陆官网nwjs.io,有normal和SDK两个下载版本。在开发中,我们选择SDK的版本,因为它有开发者调试的功能。


下载完毕后解压,我们就会看到nw.js默认的目录


新建app文件夹,我们的代码都会放在这

(2)简单的hello world

在app文件夹中新建index.html


新建package.json,其中“name”和“mian”都是必须的,项目启动时,首先会进入package.json查看配置信息。name表示客户端的名字,必须唯一;mian是初始页面的路径


拖拽app文件夹到nw.exe运行文件



打包的过程不再多说,网上有很多教程:压缩成app.nw,然后执行copy /b nw.exe+app.nw nw-demo.exe

(3)构建node项目

命令行进入app文件夹,执行 npm install express --save,安装express,生成node的依赖包node-modules,如图


继续新建app.js(node项目启动文件),public(静态资源)等等,这里只是简单演示。有几个步骤:

1. 把index.html移到public文件夹下

2. 修改package.json中的“mian”为 "public/index.html"

目录结构如下:


再次拖拽运行,没有问题

(4)编写app.js,开启服务器;编写index.html发送请求

在package.json中添加  "node-main":"app.js"



再次拖拽运行,右击开启开发者模式,点击“get”,响应成功


相关文章

  • 用nw.js构建node项目

    在网上找了很多nw.js快速开始的教程,很大一部分都是通过最基本的index.html和package.json来...

  • 用nw.js构建项目

    我是又忙又懒。 跟electron一样,nw.js也是一个使用前端技术(html、css、JavaScript)来...

  • nw.js学习笔记

    一、初识Nw.js NW.js是基于Chromium和Node.js运行的, 以前也叫node-Webkit。顾名...

  • 使用html+js+css编写桌面应用

    已知的三种方式: 1,node-webkit 简称nw.js 项目主页:https://nwjs.io/ 2,有道...

  • Vue+Cordova环境搭建

    1、安装node.js 2、安装vue-cli脚手架构建工具 3、用vue-cli构建项目 4、运行vue项目 5...

  • nwjs学习(1)

    NW.js是什么?NW.js(原名node-webkit)是一个基于chromium和nodejs的应用运行时,通...

  • vue-cli 注释详解(build目录)

    1.项目结构 开发过程(执行npm run dev)中,先是运行本地构建的服务器(这里用的是node,因为node...

  • Vue + Electron 开发桌面应用

    之前使用NW.js开发过一个桌面应用,整体感觉还是可以的。结合Node.js 和 NW.js提供的操作接口,可以实...

  • vue.js+webpack构建项目

    在使用webpack+vue.js构建项目之前,首先得全局安装node,必须在node环境下构建。 1.创建一个基...

  • vite events.js:291 throw er;

    在使用vite构建项目时,报错events.js:291 throw er;终端输入 node node_modu...

网友评论

      本文标题:用nw.js构建node项目

      本文链接:https://www.haomeiwen.com/subject/wxirmxtx.html