browserify

require is not defined error with browserify

由 随声附和 提交于 2019-11-27 11:55:45
I'm new to browserify and trying to load npm modules in browser but I'm getting the following error: Uncaught ReferenceError: require is not defined I'm following the tutorial from http://browserify.org/ . Created javascript file with the following content: var unique = require('uniq'); then run npm install uniq and browserify main.js -o bundle.js the bundle.js file is generated and I included it in my html but still getting the above error. Any ideas what am I doing wrong? This is the content of final HTML file: <!DOCTYPE html> <html> <head> <title></title> <script src="bundle.js"></script>

Browserify - multiple entry points

由 Deadly 提交于 2019-11-27 11:43:56
问题 I am using Browserify within gulp. I am trying to compile down my tests to a single file as well. But unlike my main app, which I have working just fine, I am having trouble getting the tests to compile. The major difference is the tests have multiple entry points, there isn't one single entry point like that app. But I am getting errors fro Browserify that it can't find the entry point. browserify = require 'browserify' gulp = require 'gulp' source = require 'vinyl-source-stream' gulp.task

Keep original typescript source maps after using browserify

由 ↘锁芯ラ 提交于 2019-11-27 10:55:28
问题 Background: I am compiling 2 dependent TypeScript files to js, which produces also source maps (one source map per file) using tsc 1.0 I'm using -m commonjs and then use browserify to generate a single bundle.js However I noticed that I get the original source map references twice in the bundle, which doesn't seem to work. Passing --debug doesn't seem to do the trick either. I had a feeling this issue: https://github.com/substack/node-browserify/issues/325 is somewhat related, but I couldn't

SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' - Wait what?

由 故事扮演 提交于 2019-11-27 09:12:53
So consider the following two files: app.js import Game from './game/game'; import React from 'react'; import ReactDOM from 'react-dom'; export default (absPath) => { let gameElement = document.getElementById("container"); if (gameElement !== null) { ReactDOM.render( <Game mainPath={absPath} />, gameElement ); } } index.js import App from './src/app'; The gulpfile.js var gulp = require('gulp'); var source = require('vinyl-source-stream'); var browserify = require('browserify'); var babelify = require("babelify"); var watch = require('gulp-watch'); gulp.task('make:game', function(){ return

Create separate JavaScript bundles with a shared common library using Browserify and Gulp

由 荒凉一梦 提交于 2019-11-27 09:09:55
问题 For my team at work, I'm trying to set up a semi- automated JavaScript script and dependency management system with the help of Gulp and Browserify. I'm not even sure if what I'm trying to achieve is possible with the currently available set of tools (and my limited JavaScript knowledge). I believe what I'm trying to achieve is a pretty common scenario, but I haven't been able to find the information I've been looking for. Consider the following diagram: The lines indicate depedencies. For

How to import part of object in ES6 modules

由 ￡可爱￡侵袭症＋ 提交于 2019-11-27 08:54:11
In the react documentation I found this way to import PureRenderMixin var PureRenderMixin = require('react/addons').addons.PureRenderMixin; How can it be rewritten in ES6 style. The only thing I can do is: import addons from "react/addons"; let PureRenderMixin = addons.addons.PureRenderMixin; I hope there is a better way. Unfortunately import statements does not work like object destructuring . Curly braces here mean that you want to import token with this name but not property of default export. Look at this pairs of import/export: //module.js export default 'A'; export var B = 'B'; //script

Defining global variable for Browserify

由 时光毁灭记忆、已成空白 提交于 2019-11-27 08:14:14
I'm using SpineJS (which exports a commonjs module) and it needs to be available globally because I use it everywhere, but It seems like I have to do Spine = require('spine') on every file that uses Spine for things to work. Is there any way to define Spine once to make it globally available? PS: I'm using Spine as an example, but I'm in general wondering about how to do this with any other library. Writing Spine = require('spine') in each file is the right way to do. Yet, there are several possibilities by using the global or window object (browserify sets the global object to window , which

Modules vs. Namespaces: What is the correct way to organize a large typescript project?

由 ╄→尐↘猪︶ㄣ 提交于 2019-11-27 08:02:01
I'm pretty new to typescript and I'm writing a small prototyping framework for WebGl. I'm currently refactoring my project and have run into some problems as how to organize my project, as both (modules and namespaces) approaches seem to have serious drawbacks. This post is not about HOW to use these patterns, but how to overcome the problems each of these brings. Status Quo: Using namespaces Coming from C# this seemed like the most natural way to go. Every class/module gets it's appropriate namespace and I supply the "outFile" parameter in the tsconfig.json so everything gets concatenated

How do I use Browserify with external dependencies?

由 柔情痞子 提交于 2019-11-27 06:33:35
I am trying to slowly introduce Browserify into my site, but I don't want to rewrite all the js and I don't want duplicate instances of jquery and other libraries bundled with my Browserify build. If I build my module listing jquery as an external dependency, how do I then point it at my global jquery instance? Also the goal is to eliminate the mylibs global (example below), so I don't want to use it in my module. This is what I'm trying to do (psudo-code). This would be in my site's repo - not the module's. The module would be installed with Bower: var mylibs.jQuery = $.noConflict(); //

了解Browserify

由 我的未来我决定 提交于 2019-11-27 06:10:43
Browserify 是一个Javascript的库，可以用来把多个Module打包到一个文件中，并且能很好地应对Modules之间的依赖关系。而Module是封装了属性和功能的单元，是一个Javascript对象，Modules之间可以相互依赖。某种程度上来说，Browserify模仿了Node.js加载Module的方式。一个js文件包含一个Module。所以，Browserify通过读取文件来加载该文件内的Module。 【module的写法】 'use strict'; exports.save = function(tasks){}; exports.load = function(){}; exports.clear = function(){}; 还可以这么写： 'use strict'; module.exports = { save: function(tasks){}, load: function(){}, clear: function(){} }; 【module的缓存】 1、单例模式缓存 module a exports.value = "original"; module b var a = require('./a'); a.value = "changed"; console.log(a.value);//changed module c var
订阅 browserify