要求在全球範圍內使用jQuery UI模塊的jQuery

我正在研究angular 2，我想從jquery ui中需要jQuery。每個模塊都通過訪問全局變量將自身添加到jQuery中。我花了幾個小時在Github和Stackoverflow（以及其他隨機網站）的每個角落尋找解決方案，但到目前爲止，沒有一個人能夠工作。要求在全球範圍內使用jQuery UI模塊的jQuery

方法我都試過：

ProvidePlugin爲$，jQuery和window.jQuery，暴露裝載機進口裝載機在我的籌碼不同位置顯然我失去了一些東西，需要的jQuery 各種其他的組合這裏。每次我寫進口「的jQuery UI的」，我得到「jQuery是未定義

感謝。

我webpack.config.js（發展）

var path = require('path'); 
var autoprefixer = require('autoprefixer'); 
var webpack = require('webpack'); 
const DedupePlugin = require('webpack/lib/optimize/DedupePlugin'); 
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin'); 


var commonConfig = { 
    resolve: { 
    extensions: ['', '.ts', '.js'], 
    alias: { 
     'jquery': path.join(__dirname, 'node_modules/jquery/dist/jquery'), 
    } 
    }, 
    module: { 
    loaders: [ 
     // TypeScript 
     { test: /\.ts$/, loaders: ['ts-loader'] }, 

     { test: /\.css$/, loaders: ['style','css'] }, 
     { 
     test: /\.html/, 
     loader: 'html', 
     query: { 
      minimize: true, 
      removeAttributeQuotes: false, 
      caseSensitive: true, 
      // Teach html-minifier about Angular 2 syntax 
      customAttrSurround: [ 
      [/#/, /(?:)/], 
      [/\*/, /(?:)/], 
      [/\[?\(?/, /(?:)/] 
      ], 
      customAttrAssign: [/\)?\]?=/] 
     } 
     }, 
     { test: /\.scss$/, loaders: ['to-string', 'css', 'postcss', 'resolve-url', 'sass?sourceMap'] }, 
     { test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' } 
    ] 
    }, 
    'uglify-loader': { 
    mangle: false 
    }, 
    postcss: function() { 
    return [autoprefixer]; 
    }, 
    plugins: [ 
    new webpack.optimize.OccurenceOrderPlugin(true), 
    new webpack.DefinePlugin({ 
     ENV: JSON.stringify(process.env.ENV) 
    }) 
    ], 
    devtool: process.env.ENV == 'dev'? 'source-map' : null 
}; 

module.exports=commonConfig;

來源

2016-07-23 Kritika Bahl

Kritika看看我其他的，不闖民宅jQuery的UI .....是頁的工作的一部分的jQuery？ –

Kritika我的意思是，你在那個頁面中使用除jQuery UI以外的jquery？ –

從'@ angular/core'導入{Component，OnInit，ElementRef}; 從'jquery'導入*爲$; 導入「jquery-ui」;是的，我先進口jquery，然後jquery-ui –

幾種方法來處理這個：

1-進口的jQuery作爲腳本中，你的index.html。這應該是直截了當通過的WebPack

2-導入它;

。

在你的webpack通用;

alias: { 
    "jquery-ui": "jquery-ui/jquery-ui.js" 
} 
. 
. 
. 
plugins: [ 
    new webpack.ProvidePlugin({ 
     jQuery: 'jquery', 
     $: 'jquery', 
     jquery: 'jquery' 
    }) 
    , and the rest of you plugins 
]

在你的分型：

1 - 無論是下載源代碼，並把它放在你的文件夾中的某處

2或用分型install來安裝它：這裏的定義是：

Jquery Typings

您app.ts內（根組件）

declare var jQuery : JQueryStatic;

並有answer

來源

2016-07-24 03:00:05 Milad

我想通過導入它通過webpack.It它不會這樣工作...已經嘗試過。 –

我做過類型安裝dt〜jquery --global --save，typings安裝dt〜jquery-ui --global --save然後將它們添加到index.d.ts文件以及jquery對我來說工作得很好，但是jquery-ui無法找到'jQuery'變量 –

webpack插件完成這項工作，它告訴你的jQuery-ui $等於jQuery，請確保使用它 – Milad

要求在全球範圍內使用jQuery UI模塊的jQuery

回答

相關問題