Javascript 网页包装多个条目不';t工作:“;XY函数未定义";
我有以下文件:Javascript 网页包装多个条目不';t工作:“;XY函数未定义";,javascript,webpack,Javascript,Webpack,我有以下文件: main.js main-essentials.js 在这些文件中是我无法更改的javascript。我想将这两个文件合并为一个main.js 我这样试过: entry: { main: [ './js/main.js', './js/main-essentials.js', './scss/main.scss', './scss/main-essentials.scss', ], }, mai
- main.js
- main-essentials.js
main.js
我这样试过:
entry: {
main: [
'./js/main.js',
'./js/main-essentials.js',
'./scss/main.scss',
'./scss/main-essentials.scss',
],
},
main-essentials.js中有一个位于最顶端的函数
function scrollToObject(t, e, o) {
e = e || 0;
jQuery("html, body").animate({
scrollTop: jQuery(t).offset().top - e
}, 1e3), o && o()
}
在内联脚本中,我调用这个函数
<script>
if(true)
scrollToObject("#my-element","120");
</script>
const webpack = require('webpack')
const fs = require('fs')
const path = require('path')
const ManifestPlugin = require('webpack-manifest-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const { VueLoaderPlugin } = require('vue-loader')
const CompressionPlugin = require('compression-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = (env, argv) => ({
entry: {
main: [
'./js/main.js',
'./js/main-essentials.js',
'./scss/main.scss',
'./scss/main-essentials.scss',
],
'vue-main': './js/index.ts',
'../js/jui/jquery.min': './js/jquery.ts',
'critical-home': './scss/critical-home.scss',
'critical-membership-details': './scss/critical-membership-details.scss',
},
output: {
filename: (file) => {
if (file.chunk.name === '../js/jui/jquery.min') {
return '[name].js'
}
return '[name].[contenthash].js'
},
path: path.resolve(__dirname, 'dist'),
},
devtool: argv.mode === 'development' ? 'inline-source-map' : false,
plugins: [
new ManifestPlugin(),
new CleanWebpackPlugin(),
new VueLoaderPlugin(),
argv.mode === 'production' ? new CompressionPlugin() : false,
new MiniCssExtractPlugin({
filename: '[name].[contenthash].css',
}),
].filter(Boolean),
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
},
{
test: /\.ts$/,
loader: 'ts-loader',
options: {
appendTsSuffixTo: [/\.vue$/],
},
},
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: [['@babel/preset-env', { modules: false, targets: 'ie 11' }]],
},
},
},
{
test: /\.(scss|sass|css)$/,
use: [
'vue-style-loader',
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
url: (url, resourcePath) => {
if (resourcePath.includes('main-essentials.scss') || resourcePath.includes('critical-')) {
return false
}
return true
},
}
},
'postcss-loader',
'sass-loader',
],
},
{
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: 'fonts/',
},
},
],
},
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: 'file-loader',
options: {
esModule: false,
},
},
],
},
{
test: /\.ini$/i,
use: 'ini-loader',
},
],
},
resolve: {
extensions: ['.ts', '.js', '.vue', '.json'],
alias: {
vue: 'vue/dist/vue.esm-browser.js',
},
},
optimization: {
splitChunks: {
chunks(chunk) {
return chunk.name !== '../js/jui/jquery.min';
},
},
},
})