1、先用create-reat-app创建一个程序 在package.json中配置 "homepage": ".", 要可以从本地访问 2、npm i electron --save-dev 3、在package.json中配置入口文件,具体如下: { "name": "myre", "versi ...
转载 2021-05-12 23:35:00
269阅读
2评论
main.js package.json 执行 npm run dev
转载 2018-08-23 11:53:00
152阅读
2评论
# 使用React、TypeScript和Electron构建跨平台桌面应用 随着技术的不断进步,我们现在可以使用Web技术来开发跨平台的桌面应用程序。React和TypeScript是目前非常流行的前端开发技术,而Electron是一个强大的桌面应用程序开发框架。本文将带您深入了解如何使用React、TypeScript和Electron来构建跨平台的桌面应用程序。 ## 什么是React
原创 2023-10-16 09:18:16
67阅读
You can easily spend hours configuring the perfect dev environment with all the latest hotness like ES6 (and beyond) support, hot reloading, and a myr...
转载 2015-09-06 03:13:00
114阅读
2评论
1. Electron 是什么?使用github开发的开源框架允许开发者使用Web(js,html,css)技术构建跨平台的桌面应用Electron=Chrominum + node.js + Native API高效:通过Web技术写UI能力:底层能力能力&体验:跨平台&原生能力2. Chromium + NodejsChromium架构Chromium是谷歌开源的项目,相当于c
转载 2023-07-26 16:08:42
176阅读
快速搭建react-webpack
原创 2017-03-13 16:20:12
1161阅读
node是运行引擎,通过他可以直接在后端运行js语法 webpack是打包工具 react是前端框架 通过 npm 使用 React 我们建议在 React 中使用 CommonJS 模块系统,比如 browserify 或 webpack,本教程使用 webpack。 国内使用 npm 速度很慢,
转载 2017-09-22 02:22:00
64阅读
2评论
什么是 React ⚛️React 是 Facebook 开发的一个 JavaScript 库,除其他外,它还用于构建 Instagram.com。它的目的是让开发人员能够轻松地为网站和应用程序等创建快速的用户界面。React 的主要概念。js是虚拟DOM什么是Electron.jsElectron.js 是一个运行时框架,允许用户使用 HTML5、CSS 和 JavaScript 创建桌面套件应
原创 2023-02-13 13:58:10
1481阅读
步骤:1, 先创建一个react 项目。2,然后修改 package.json 添加 electron 依赖。 electron 的基础实现中的main.js package.json 修改的部分:{  "main": "main.js",  "dependencies": { ...    "electron": "7.3.3", ...  },  "scripts": {    ...    
转载 2021-02-27 12:49:02
233阅读
2评论
If you try to use CSS Modules in TypeScript the same way you would use them in JavaScript, with webpack’s css-loader, you’ll see an error: ”TS2307: Ca
转载 2018-01-26 20:13:00
154阅读
2评论
常用配置说明entry可以接受字符串,数组,对象等多种格式项目打包入口文件,可以是绝对路径也可以是相对路径webpack 打包默认入口文件是 ./src/index.js 约定,默认输出是 项目根目录下 /dist/main.jsoutput 打包后的内容输出相关配置,path打包后文件路径, 只能使用绝对路径常用loader相关理解默认情况下,webpack 值支持.js,.json文件,通过
转载 2021-01-29 10:59:50
551阅读
2评论
webpack插件:npminstallbabel-corebabel-loaderbabel-preset-reactbabel-preset-es2015sublime插件:jsx//高亮jsx语法修改webpack配置文件:```constpath=require('path');module.exports={entry:'./src/index.js',d
原创 2018-04-06 13:44:24
1122阅读
安装配置Babel babel preset es2015 ES6语法包,使代码可以随意地使用ES6的新特性。 babel preset react React语法包,专门用于React的优化,在代码中可以使用React ES6 classes的写法,同时直接支持JSX语法格式 安装Babel lo
「这是我参与2022首次更文挑战的第10天,活动详情查看:2022首次更文挑战」。Dear,大家好,我是“前端小鑫同学”,????长期从事前端开发,安卓开发,热衷技术,在编程路上越走越远~
原创 2022-04-12 10:50:55
1607阅读
resolvewebpack 的底层配置项resolve主要和模块解析的路径相关,常见的例如mainFiles ,extensions等resolve.alias配置模块依赖别名,常见的@解析到src文件夹,path.resolve本身是用来构造绝对路径的,所以@总能解析到src目录的路径module.exports = {  resolve: {alias: {      '@': path.r
转载 2021-01-19 22:03:21
541阅读
2评论
chunk 和 bundleConcepts - Bundle vs Chunk经常让人摸不着头脑的是 chunk 和 bundle 这两个概念。chunk,翻译过来就是大块,也就是代码块;而 bundle 则是束,包的意思。从 webpack 给出的术语表中是这么解释的:Chunk: This webpack-specific term is used internally to manage
转载 2021-01-19 22:07:28
530阅读
2评论
上篇文章简单介绍了以下webpack内部WDS的使用,这节讨论一下WDS内部proxy的配置方式。devServerwebpack-devServer,一般简称WDS,是 webpack 内置的用于开发环境的服务器配置。webpack本身提供三种方式用于开发环境修改代码以后自动编译,以提高开发效率:观察模式WDSwebpack-dev-middleware总体来说,WDS 配置最容易,并且提供 H
转载 2021-01-19 22:09:40
560阅读
2评论
配置 webpackwebpack 介绍根据webpack官网的解释来说,webpack是一个现代 JS 应用的 bundler,翻译过来就是打包器。webpack会根据模块之间的依赖最终合并模块形成一个或者多个 bundles。安装 webpack 脚手架,以及命令行工具yarn init yarn global add webpack webpack-cli复制代码修改项目目录添加 dist
转载 2021-01-19 22:33:19
752阅读
2评论
一、gulp 1 var gulp = require('gulp'); 2 var react = require('gulp-react'); 3 4 gulp.task('jsx', function() { 5 gulp.src('./app.jsx') 6 .pi...
转载 2015-12-23 21:48:00
146阅读
2评论
react 没有配置 alias(别名) 引入文件的时候 只能通过 ../../ 的方式引入,项目大了 这样操作就比较繁琐麻烦 运行 npm eject 将配置暴露出来 找到 webpack.config.js 文件修改如下 const path = require('path'); const r ...
转载 2021-11-04 09:58:00
607阅读
2评论
  • 1
  • 2
  • 3
  • 4
  • 5