HTML如何引用插件,【webpack】 如何引用本地插件?

我有个npm上没有的js插件,怎么打包到全局?

var webpack = require('webpack');

var path = require('path');

module.exports = {

entry: {

main:'./app/index.js'

},

output: {

filename: '[name].js',,

path:path.resolve(__dirname, 'dist')

},

resolve:{

modules:[

path.resolve(__dirname, "app"),

"node_modules"

]

}

}

bVNzKk?w=353&h=581

直接在index.js使用require引入报错找不到;

后来我使用CommonsChunkPlugin打包成vendor还是不行;

var webpack = require('webpack');

var path = require('path');

var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {

entry: {

main:'./app/index.js',

vendor: ['lib/easeljs/easeljs-0.8.2.min.js','lib/preloadjs/preloadjs-0.6.2.min.js','lib/tweenjs/tweenjs-0.6.2.min.js']

},

output: {

filename: '[name].js',

path:path.resolve(__dirname, 'dist')

},

resolve:{

modules:[

path.resolve(__dirname, "app"),

"node_modules"

]

},

plugins: [

new webpack.optimize.CommonsChunkPlugin({

name: 'vendor'

}),

new HtmlWebpackPlugin({

filename: 'index.html',

template: './app/index.html'

})

]

}

bVNzOk?w=765&h=712

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要通过webpack将本地的HTML文件上传到服务器,您可以按照以下步骤进行操作: 1. 确保您已经安装了webpack和相关的loader。可以使用以下命令进行安装: ``` npm install webpack webpack-cli html-webpack-plugin file-loader -D ``` 其中,`html-webpack-plugin`用于自动生成HTML文件,`file-loader`用于处理文件的加载。 2. 在webpack的配置文件中添加以下配置: ```javascript const HtmlWebpackPlugin = require('html-webpack-plugin'); const path = require('path'); module.exports = { // 入口文件 entry: './src/index.js', // 输出文件 output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js' }, // 添加loader module: { rules: [ { test: /\.html$/, use: [ { loader: 'file-loader', options: { name: '[name].[ext]' } } ] } ] }, // 添加插件 plugins: [ new HtmlWebpackPlugin({ template: './src/index.html' }) ] }; ``` 其中,`entry`指定了入口文件,`output`指定了输出文件的路径和文件名,`module`中的`rules`指定了处理HTML文件的loader,`plugins`中的`HtmlWebpackPlugin`用于自动生成HTML文件。 3. 将HTML文件放到src目录下,例如:src/index.html。 4. 在package.json文件中添加以下脚本: ```json "scripts": { "build": "webpack", "upload": "scp -r ./dist/* user@host:/path/to/destination" } ``` 其中,`build`用于打包文件,`upload`用于上传文件。请将`user@host`和`/path/to/destination`替换为您的服务器登录信息和目标路径。 5. 运行以下命令进行打包和上传: ``` npm run build npm run upload ``` 执行完毕后,HTML文件就会被上传到指定服务器的目标路径下。 请注意,以上步骤仅供参考,具体操作流程和配置可能会有所不同。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值