在Node.js中,使用require函数加载模块。Node.js会按照以下规则来查找和加载模块:
根文件夹建立一个src文件夹,里面添加index.js文件,再在根目录添加webpack.dev.config.js
很多时候我们都希望首屏速度快,SEO友好,那么相比于客户端渲染的 SPA,SSR 在 SEO 方面有明显的优势,在之前的 Next.js 的文章中,就有同学说要 Next.js 的 SSR,现在,它来了。
一、vue项目的创建 1、首先第一肯定是要有Node.js及npm这个不多说了 2、安装脚手架 此时可以直接浏览-但是现在肯定有很多小白想将他发布到gitHub上并可以浏览,使用vue全家桶制作自己的
gulp 是基于流(stream)的自动化构建工具,能帮助前端节省很多资源。 OK,直接进入主题——本篇中将主要介绍怎么用gulp。
很多时候我们都希望首屏速度快,SEO友好,那么相比于客户端渲染,SSR渲染将是这方面的优势。
2018-10-26 by Liuqingwen | Tags: Hexo | Hits
根目录下有demo1和images/1.jpg,demo1下有index1.html文件和demo1.1文件夹。demo1.1下有index2.html和2.jpg图片文件。
答:对于 nodeJS 项目的运行,只需要安装一个 node的环境就可以了,不需要其他的配置。 使用 cmd 命令,打开 window 窗口,输入 node -v ,如果运行的结果是 nodeJS的一个版本,说明环境就已经OK了。
此时可以看到dist目录的文件图标由 W 变成了 A,说明此时的web项目已经变成了移动APP项目 ,而且此时生成了一个新的文件manifest.json
2、难以维护,如果我文件路径移动了一下...所有引用的地方都要改 就算你会全局替换,摸摸你的良心说,你心里不慌吗,反正我慌得一匹
如何从零开始一个vue+webpack前端工程工作流的搭建,首先我们先从项目的目录结构入手。一个持续可发展,不断加入新功能,方便后期维护的目录结构究竟是长什么样子的?接下来闰土大叔带你们一起手摸手学起来。 初级前端初始化目录篇 项目伊始,我们肯定是先在terminal终端命令行(以下简称terminal)cd进入<project name>根目录,然后输入: npm init 初始化一个npm项目,在项目根目录下面就会出现一个package.json文件。 然后就可以安装依赖了,直接在termina
React提供了create-react-app的快速构建工具, 但作为一个专业的程序员(老司机), 面对复杂的项目, 入门级的构建工具, 是远远不够的, 我们这里从零开始, 用webpack, 手动
由于我在另外的一些文章所讨论或分析的内容可能基于一个已经初始化好的项目,为了避免每一个文章都重复的描述如何搭建项目,我在本文会统一记录下来,今后相关的文章直接引用文本,方便读者阅读。此文主要为个人笔记,不会有太多的关于思路的描述;另外,本文仅仅描述如何搭建基础react项目,不涉及图片等资源的加载,关于图片等资源的处理,我会单独编写一期。
chrome v28.0.1500.71 + nodejs v0.10.18 / firefox v14.0.1 + nodejs v0.10.18
最近心血来潮在开发个人博客网站,刚好可以趁这个机会出一个系列文章讲讲前端界面的设计,后端业务逻辑的实现以及前后端的交互。具体的架构我是采用Vue.js + Node.js + mysql。前端界面设计使用了element-ui和mavon-editor,后端依旧使用了express框架。首页效果和文章发表界面效果如图所示:
首先在需要在文件行数右侧点击打上断点(红色圆),然后点击下图绿色启动按钮即可开始调试,代码自动运行到断点所在行,此时鼠标移入变量可以看到每个变量的当前状态
如官方文档所言,Laravel 并不强制你使用 CSS 框架,但是开箱提供了对 Bootstrap 的支持,在 resources/js/bootstrap.js(在 Laravel 5.7 之前的版本位于 resources/assets/js/bootstrap.js)中,我们可以看到对 bootstrap js库的引入:
最早的时候看别人的博客很多都有一个可爱的看板娘,然后就找了教程给自己也整了一个。因为找到的教程都是稂莠不齐的,原作者自己说的也略显含糊(其实是我自己看不懂)。总之秉承着一如既往的小白风格。把网上的教程做个整合。
npm (全称Node PackageManager,即node包管理器)是Node.js默认的、以JavaScript编写的软件包管理系统npm来分享和使用代码已经成了前端的标配
多页面 html 生成 let path = require('path') let htmlWebpackPlugin = require('html-webpack-plugin') functi
编译报错:$ is undefined or no-undef '$' is not defined, 假设你已经使用vue-cli搭建好了开发的脚手架,接下来,看下面。。。 NPM 安装 jQuery,项目根目录下运行以下代码
注册npm账户 ---- 注册地址 用户名,密码,邮箱后面发布会用到 注册完需要验证邮箱 会发送邮件至你注册的邮箱 按指示完成验证即可 新建项目 ---- 创建目录 mkdir package 切换目录 cd package 初始化npm npm init -y 后续可在 package.json 文件中增加更改配置 安装ESlint ---- 安装 npm i eslint 初始化配置 eslint --init 配置 Commitlint ---- 安装 Commitlint 脚手架和
在 hbuilderX的菜单“视图”中选择“显示终端”,在终端中把当前目录定位到uni-app的根目录,这样才可以把crypto-js库安装在正确的位置,在终端中键入:npm install crypto-js ,等待片刻,crypto-js 库就装在了uni-app的根目录的:/node_modules/crypto-js/* 中了。要使用其相关加解密算法,只要在代码中引入:import cj from '../../../node_modules/crypto-js/crypto-js.js' 就可以搞事情了。
摘要总结:本篇文章主要介绍了在Vue2+VueRouter2+Webpack+Axios项目中如何打包项目图片等资源的处理。首先介绍了如何在vue文件中使用图片,然后介绍了在css文件中引用图片的处理方式,最后还介绍了字体图标、js文件等资源的引用方式。在开发模式中,要注意路径的相对性,以避免路径错误。通过在根目录打包项目,可以方便地引用各种资源,从而提高项目的开发效率。
写这篇博客的缘故是因为看到cnblogs上的live2d模型可以自动欢迎,但是自己又不会魔改Hexo的live2d,就想到了以弹窗的方式来欢迎。
不少同学应该都发现了,许多人的博客都有类似萌萌哒、看板娘的东西。这个其实是一个名叫hexo-helper-live2d的插件,那么,我们一起来向Hexo里放上一只萌萌哒二次元看板娘吧!
一直以来,我对自已做的微信小程序界面很不满意,但苦于对样式wxss一窍不通,只好默默忍受。俗话说的好,不在沉默中爆发就在沉默中灭亡,最近实在看不下去了,就想找个美工来帮忙,结果美工师傅没有理睬我,乍办。。。?之前就听说WeUI是微信官方为小程序量身设计的样式库,但对于年龄较大的我来说,还没有充分的胆量去尝试学习新知识,所以之前如果不是猫老师一步一步的教,一堂课一堂课的引导,估计我也早已放弃了程序设计。没有美工师傅,怎么办,那只好逼上梁山,上百度搜,结果发现其实也没那么难,因为很多好心的博主都把经验上传分享了。而且之前上过猫老师VUE的课,知道Nodejs和npm,而且微信官方的Demo也很清楚明了,那就水到渠成了。
在Hexo的 _config.yml 文件或主题的 _config.yml 文件中添加配置. 参阅 live2d-widget.js API
本教程适用于vue-cli3.x版本搭建的vue项目,解决项目本地运行一切正常,但是打包后部署时页面白屏,控制台报错,静态资源找不到的问题。
如果希望对在静态页面中引入的相关资源进行压缩(比如:CSS,JavaScript,图片等),可以使用Gulp实现。 当然,还可以其他其他打包工具,比如:Grunt,Webpack等等。
什么是 gulp 简单的讲,gulp 是一个构建工具,一个基于流的构建工具,一个 nodejs 写的构建工具,使用 gulp 的目的就是为了自动化构建,提高程序员工作效率😂。 入门指南 全局安装 gulp: $ npm install --global gulp 作为项目的开发依赖(devDependencies)安装: $ npm install --save-dev gulp 在项目根目录下创建一个名为 gulpfile.js 的文件: var gulp = require('gulp'); // 默认
简单来说把 JavaScript 中 es2015/2016/2017/2046 的新语法转化为 es5,让低端运行环境(如浏览器和 node )能够认识并执行。严格来说,babel 也可以转化为更低的规范。但以目前情况来说,es5 规范已经足以覆盖绝大部分浏览器,因此常规来说转到 es5 是一个安全且流行的做法。
本文将讲述如何基于webpack与TypeScript搭建一个基础的支持less模块的solidjs项目。方便后续涉及到solidjs相关分析与讨论都可以基于本文的成果之上进行。
软件变化请查看:更新日志 软件下载请转到:发布页面 或者到网盘下载(网盘内有MAC、windows版):https://www.lanzoui.com/b0bf2cfa/ 密码:glqw(若链接无法打开请百度:蓝奏云链接打不开) 使用常见问题请转至:常见问题 桌面版项目地址:https://github.com/lyswhut/lx-music-desktop
效果如下,在 dist 目录生成 index.html,同事也引入了 a.js, main.js
网站开启 https 之后,要求所有的请求都是https的,但是度娘了一下,目前基本没有分享代码支持https,怎么办,还是万能的百度帮忙解决了,具体方法如下
在项目根目录下创建”api”文件夹,在api中创建”index.*”(例如index.js)的文件,则该文件会被尝试执行,如果将js文件直接放在根目录,则会被当作文本文件读取
在8月30号的时候,微信开发者工具进行了一次升级,在升级日志中我们看到微信小程序开始支持npm包管理了。但是小程序的基础版本库是从2.2.1版本开始支持,很遗憾的是在2.2.1以前的版本上则会报错。
在正常的开发中,大部分都会使用MVC为主要的系统架构模式。而Model一般包含了复杂的业务逻辑以及数据逻辑,因为Model中逻辑的复杂度,所以我们有必要降低系统的耦合度。通常情况下,我们如果直接使用JDBC操作数据库,业务逻辑和数据存取逻辑是混在一起的。我们一般一个功能的逻辑可能如下所示:
我们知道部署web应用程序的最佳方式是作为静态HTML应用程序,因为他对搜索引擎很友好,速度快等等,这对我们写个人博客这样的小型网站无异于非常nice。如果你的应用可以作为静态HTML,那么可以试试Next.js。
最近接手了一个基于 uniapp 的开发项目,我个人对于它能够使用同一套代码就能够开发 h5\app\小程序 的强大功能表示非常钦佩。但是其配置文件 pages.json 也让我十分郁闷,原因无他,只因其是写死 JSON 文件,在管理的时候是十分不便的。
本文主要介绍如何在Vue和React项目中使用ArcGIS JS API进行开发,与以往的esri-loader开发方式不同的是,本文使用的是@arcgis/cli脚手架的开发方式。
pod 'React', :path => './node_modules/react-native', :subspecs => [
pc端和移动端的UI组件库有非常多,但是小程序适合uniapp的比较好用的UI组件库就没那么多了,大家常用的也就vant了,而今天小师妹就给大家介绍一个基于 uni-app 开发、免费可商用的微信小程序UI框架
使用Webpack往往离不开loader的安装配置,手写一个loader其实非常简单,类似手写一个功能函数,下面我们来实现一个替换字符串的loader
一、问题简介 监控目录下所有文件,只要有文件更新就立刻重启。 二、解决方案 1、--watch 监控项目目录下所有文件,任意文件有改动,就自动重启 node.js 项目。 # 1、安装 pm2 npm install pm2 @latest -g # or yarn global add pm2 # 2、转到 node.js 项目根目录下 cd < 项目根目录 > # 3、用 pm2 启动 node.js 项目,项目目录下有文件改动就重启 pm2 start app.js--watch # 现在就可以
领取专属 10元无门槛券
手把手带您无忧上云