babel

Module build failed (from ./node_modules/babel-loader/lib/index.js): TypeError: Cannot read property 'bindings' of null

六眼飞鱼酱① 提交于 2019-12-20 18:29:40
问题 I've got an error while building a project: Module build failed (from ./node_modules/babel-loader/lib/index.js): TypeError: Cannot read property 'bindings' of null My development environment is as follows: Node: 8.0.0 npm: 5.0.0 devDependencies "devDependencies": { "babel-core": "^6.26.3", "babel-loader": "^8.0.0", "babel-preset-env": "^1.7.0", "webpack": "^4.17.1", "webpack-dev-server": "^3.1.7" } 回答1: babel-loader@8.x uses Babel 7.x, which is @babel/core@^7.0.0 , and more importantly in

Syntax error in IE11 with Webpack, Babel and React

↘锁芯ラ 提交于 2019-12-20 10:27:49
问题 I'm getting a Syntax Error in my React + Redux project in Internet Explorer 11, but I have no idea why it's caused. I'm using Webpack and Babel to compile it. I tried using babel-polyfill and babel-es6-polyfill, but that didn't help. This is the error I'm getting: SCRIPT1002: Syntax error File: app.js, Line: 70, Column: 1 Line 70 Column 1 is where the eval starts of Webpack: /***/ }), /* 21 */, /* 22 */ /***/ (function(module, exports, __webpack_require__) { "use strict"; eval("\n\nObject

Vue JS 2.0 not rendering anything?

萝らか妹 提交于 2019-12-20 08:23:35
问题 Using Vue (^2.0.0-rc.6) + Browserify, entry point is index.js: import Vue from 'vue' import App from './containers/App.vue' new Vue({ // eslint-disable-line no-new el: '#root', render: (h) => h(App) }) App.vue: <template> <div id="root"> <hello></hello> </div> </template> <script> import Hello from '../components/Hello.vue' export default { components: { Hello } } </script> <style> body { font-family: Helvetica, sans-serif; } </style> Hello.vue: <template> <div class="hello"> <h1>\{{ msg }}<

VUE2组件懒加载浅析

情到浓时终转凉″ 提交于 2019-12-20 07:18:25
VUE2组件懒加载浅析 vue2组件懒加载浅析 一、 什么是懒加载 懒加载也叫延迟加载,即在需要的时候进行加载,随用随载。 二、为什么需要懒加载 在单页应用中,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,延时过长,不利于用户体验,而运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效的分担首页所承担的加载压力,减少首页加载用时 三、如何与webpack配合实现组件懒加载   1、在webpack配置文件中的output路径配置chunkFilename属性 1 2 3 4 5 6 output: { path: resolve(__dirname, 'dist' ), filename: options.dev ? '[name].js' : '[name].js?[chunkhash]' , chunkFilename: 'chunk[id].js?[chunkhash]' , publicPath: options.dev ? '/assets/' : publicPath },   chunkFilename路径将会作为组件懒加载的路径   2、配合webpack支持的异步加载方法 resolve => require([URL], resolve), 支持性好 () => system.import(URL)

webpack构建vue项目(配置篇)

社会主义新天地 提交于 2019-12-20 07:18:09
最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出来,欢迎大神来拍砖。。。 一、新建一个项目目录,cd /d 定位进去,然后输入npm init,会提示你填写一些项目的信息,一直回车默认就好了,或者直接执行npm init -y 直接跳过,这样就在项目目录下生成了一个package.json文件。 二、接下来就是通过npm安装项目依赖项,命令行输入:npm install babel-loader babel-core babel-plugin-transform-runtime babel-preset-es2015 babel-preset-stage-0 babel-runtime vue-loader vue-html-loader vue-hot-reload-api css-loader style-loader webpack webpack-dev-server --save-dev ,继续输入npm install vue@^1.0.26 --save 。 这里注意的几个点如下: 1.需要安装的依赖项视具体的项目需求来定,我只是安了几个必需的,后期会再加; 2.输入之后如果一直报错或者光标一直在转动

How to upgrade to babel 7

落爺英雄遲暮 提交于 2019-12-19 17:32:53
问题 I tried to upgrade Webpack and babel to 4, 7 respectively but couldn’t make it work. Also the official doc isn’t helping much with the upgrade I am getting following issue compiler error: ERROR in Cannot find module '@babel/core' @ multi main dependencies I am using: "babel-core": "^6.26.3", "babel-eslint": "^9.0.0", "babel-loader": "^8.0.0", "babel-plugin-transform-class-properties": "^6.24.1", "babel-plugin-transform-object-rest-spread": "^6.26.0", "babel-polyfill": "^6.26.0", "babel-preset

How to add flow (flowtype) support in nuxt?

早过忘川 提交于 2019-12-19 10:31:27
问题 I want to add flow support to a nuxt project (my project uses webpack and babel). Can I find a working example somewhere? If I run flow check , there are no errors, bun when I run yarn run dev , I get a syntax error. (I know there are these unanswered questions out there, I raise the same issue again hoping this time it will reach some guys with knowledge on the matter.) Thanks 回答1: There a lot of things to configure. Let me guide you trough this process. TLDR : use wemake-vue-template. It

How to add flow (flowtype) support in nuxt?

微笑、不失礼 提交于 2019-12-19 10:29:08
问题 I want to add flow support to a nuxt project (my project uses webpack and babel). Can I find a working example somewhere? If I run flow check , there are no errors, bun when I run yarn run dev , I get a syntax error. (I know there are these unanswered questions out there, I raise the same issue again hoping this time it will reach some guys with knowledge on the matter.) Thanks 回答1: There a lot of things to configure. Let me guide you trough this process. TLDR : use wemake-vue-template. It

babel 7 - how to prevent adding of “strict mode” [duplicate]

断了今生、忘了曾经 提交于 2019-12-18 16:55:20
问题 This question already has answers here : How to stop babel from transpiling 'this' to 'undefined' (and inserting “use strict”) (2 answers) Closed 7 months ago . I looked at many posts but still cannot get this to work :( I have .babelrc { "comments": false, "presets": [ ["@babel/env", { "targets": { "browsers": ["ios 7"] } }], ["minify"] ] } I want to tell babel to not add "use strict" (anywhere) How is this done ? 回答1: Babel assumes by default that files being transformed are ES modules.

babel 7 - how to prevent adding of “strict mode” [duplicate]

◇◆丶佛笑我妖孽 提交于 2019-12-18 16:55:11
问题 This question already has answers here : How to stop babel from transpiling 'this' to 'undefined' (and inserting “use strict”) (2 answers) Closed 7 months ago . I looked at many posts but still cannot get this to work :( I have .babelrc { "comments": false, "presets": [ ["@babel/env", { "targets": { "browsers": ["ios 7"] } }], ["minify"] ] } I want to tell babel to not add "use strict" (anywhere) How is this done ? 回答1: Babel assumes by default that files being transformed are ES modules.