美文网首页
安装webpack编译

安装webpack编译

作者: 晓卢轩 | 来源:发表于2018-01-26 10:33 被阅读0次

npm init

npm install -g webpack

npm install babel-loader --save-devnpm install babel-preset-es2015 --sava-dev //安装转码规则

在源代码目录创建 webpack.config.js 文件,内容如下:

var path = require('path'); //加载nodejs的路径处理模块module.exports = {

    entry: './es6/index.js',

    output: {

        path: __dirname,        //__dirname是一个nodejs变量,表示当前js文件所在的目录        filename: 'bundle.js'    },

    module: {

        loaders: [            {

                test: path.join(__dirname, 'es6'),    //配置文件目录下的es6文件夹作为js源代码文件夹,所有源代码一定要放在该文件夹下                loader: 'babel-loader' ,

                query: {

                    presets: ['es2015']                }

            }

        ]

    }

};

注意:test配置指定了哪些是ES6代码,可以指定一个文件夹,则所有源代码一定要放在该文件夹下,或者用一个 正则表达式指定哪些是ES6代码。只有ES6代码,才会编译。

最近输入webpack编译

相关文章

  • webpack 环境搭建

    webpack 环境搭建 npm 初始化项目 安装webpack依赖 webpack 初始化 添加编译插件 安装l...

  • 环境搭建

    初始化 安装webpack插件 添加编译命令 配置webpack.config.js

  • 初次使用webpack

    若有问题请看: Nodejs安装与环境配置 webpack安装 为什么使用Webpack 优点 模块化开发 编译t...

  • 安装webpack编译

    npm init npm install -g webpack npm install babel-loader ...

  • 环境配置

    1.全局编译TS文件 全局安装typescript对TS进行编译 2.配置webpack环境 安装依赖npm in...

  • webpack 笔记 指南篇(一)

    webpack 用于编译 JavaScript 模块。一旦完成安装,你就可以通过 webpack 的 CLI 或 ...

  • Webpack 常用命令总结

    webpack和npm常用命令 常用loader的安装: 样式: 测试 常用插件的安装 编译相关loader的安装...

  • webpack vue 热部署配置

    安装依赖包 使用webpack编译vue文件,支持es6语法,至少需要的依赖包为: 编写webpack配置文件 配...

  • sass安装:webpack sass编译失败,node-sas

    文章来源:sass安装:webpack sass编译失败,node-sass安装失败的终极解决方 sass难言之隐...

  • webpack安装

    在安装webpack之前要先安装node和npm webpack全局安装 webpack局部安装 webpack安...

网友评论

      本文标题:安装webpack编译

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